Uisng AJAX on existing website

Last post 09-21-2007 7:38 PM by WishStar99. 3 replies.

Sort Posts:

  • Uisng AJAX on existing website

    09-10-2007, 4:33 PM
    • Member
      132 point Member
    • Sam964
    • Member since 08-11-2004, 10:47 AM
    • Posts 85

    Hi There,

    I have an implementation question in relation to using update panels on the existing website..

    I have three contents on a page.

    Content 1 (adding new nodes to the treeview control) drives content 2(which has a treeview control) and content 2 drives content 3(which displays content in gridview according to the node clicked on treeview). I want to use update panels for content 2 and 3 so that when a new node is added, content 2(treeview) is refreshed) and when a node in content 2 is clicked, content 3 (gridview)is refreshed.

    But the documentation says that update panels do not support treeview control. I cannot use update panel for just content 3 alone as I want content 2 to refresh too whenever a new node is added in content 1.  How can I solve this problem?

    I appreciate all your suggestions.

    Thanks

     

     

     

  • Re: Uisng AJAX on existing website

    09-10-2007, 5:13 PM
    • Member
      243 point Member
    • jimzim
    • Member since 02-03-2006, 2:31 PM
    • Tampa, FL
    • Posts 41
    • TrustedFriends-MVPs

    I have used the TreeView with an update panel before.  Here is some basic code that i have gotten to work as a prototype before.  I can't remember where I got the original sample, but it went something like this:

    <div>
            <asp:ScriptManager ID="ScriptManager1" runat="server">
            </asp:ScriptManager>
       

            <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                <ContentTemplate>
                    <asp:TreeView ID="TreeViewFiles" runat="server" OnTreeNodePopulate="TreeViewFiles_TreeNodePopulate">
                    </asp:TreeView>       

                </ContentTemplate>
            </asp:UpdatePanel>
       </div>
            <asp:UpdateProgress ID="UpdateProgress1" runat="server">
                <ProgressTemplate>
                    Loading .....
                </ProgressTemplate>
            </asp:UpdateProgress>

    and in the code behind:

    protected void Page_Load(object sender, EventArgs e)
        {
            if (!Page.IsPostBack)
            {

                BuildTree();

            }
        } 

    protected void TreeViewFiles_TreeNodePopulate(object sender, TreeNodeEventArgs e)
        {
            System.Threading.Thread.Sleep(3000);
            TreeNode parentNode = e.Node;

            PopulateNormal(parentNode);
        }

     protected void BuildTree()
        {

            TreeViewFiles.Nodes.Clear();

            TreeNode root = new TreeNode("Drives", @"0");
            root.SelectAction =

            TreeNodeSelectAction.None;
            root.PopulateOnDemand = true;
            root.Selected = false;
            TreeViewFiles.Nodes.Add(root);

            TreeViewFiles.ExpandDepth = 1;

            root.Expand();

        }


        protected void PopulateNormal(TreeNode node)
        {
            string path = node.Value;

            try
            {
                DirectoryInfo directory = new DirectoryInfo(path);

                foreach (FileSystemInfo child in directory.GetFileSystemInfos())
                {
                    TreeNode childNode = new TreeNode();
                    childNode.Text = child.Name;

                    childNode.Value = child.FullName;
                    if (child is DirectoryInfo)
                    {
                        if (((DirectoryInfo)child).GetFileSystemInfos().Length > 0)
                        {

                            childNode.PopulateOnDemand =

                            true;
                        }

                    }

                    node.ChildNodes.Add(childNode);

                }

            }
            catch
            {
                // put in try catch because of secruity errors on reading local drive

               
            }


        }

     Something like that will work.  Reading the file directory is a simple way to show the tree will populate.  Hope that works for you.

    Jim Zimmerman
  • Re: Uisng AJAX on existing website

    09-21-2007, 1:34 PM
    • Member
      132 point Member
    • Sam964
    • Member since 08-11-2004, 10:47 AM
    • Posts 85

    Hi Jim,

    Thanks for your suggestion. I really appreciate it. But I have this functionality already in place. This is what I am having a problem with...I have some content (also in a different update panel with some triggers defined, one of them being the tree selectednodechanged event) on the right side of the page which changes according to the treeview node clicked (this content is on the left). So I highlight the node whenever it is clicked. If I put the tree in the update panel with updatemode as conditional and childrenastriggers=false properties, the app responds very fast, but with the bug that the newly selected node background color changes and the previous selected node color doesn't change. For example if the previousnode was selected with yellow color, the node doesn't get refreshed and the yellow color remains like that. So you now have two nodes selected, which I do not want. If I add a trigger on the tree update panel so that the panel has to refresh on selectednodechange event, then the app responds very slowly which is totally negating the concept that update panels should make the app real fast. So I am not sure what I am supposed to do...

    BTW, the reason the tree has to be in the update panel is, the tree nodes grow dynamically, which means the user can add a new node to the tree using the user interface..

    Please ask me more questions if you didn't understand the problem..

    Thanks a lot!!

  • Re: Uisng AJAX on existing website

    09-21-2007, 7:38 PM
    • Participant
      1,863 point Participant
    • WishStar99
    • Member since 08-04-2006, 8:11 PM
    • VietNam
    • Posts 553

    Sam,

    it's hard to understand you. tree left and tree right. which one is which? may be a little bit of code will help us here.

    Q1) the two nodes that are selected, are they in inside an update panel? i mean the whole tree. if yes, then try this:

    sample: <asp:updatepanel id="treeview_updatepanel" ...runat="server"><asp:treeview .... /></asp:updatepanel>

    in  your onselectednodechanged() function,  call treeview_updatepanel.update();

    .update will refresh the updatepanel, which will refresh the tree. hope it works ... =)

    //---------------------------------------------//
    //------------------- Chloé ------------------//
    //---------------------------------------------//
Page 1 of 1 (4 items)