Loading ...
Sorry, an error occurred while loading the content.

Re: [ydn-javascript] Is it possible to setup TreeView to keep it's state?

Expand Messages
  • Satyam
    You are missing the empty parenthesis at the end of getTreeDefinition, it should be: var tree_struct_x = tree.getTreeDefinition(); Without the parenthesis you
    Message 1 of 21 , Nov 3, 2008
    • 0 Attachment
      You are missing the empty parenthesis at the end of getTreeDefinition,
      it should be:

      var tree_struct_x = tree.getTreeDefinition();


      Without the parenthesis you are not assigning the tree definition to
      tree_struct_x, which is what you want, but you are assigning it a
      reference to the function, thus the alert is showing the string
      representation of that function itself, which is its code. A JSON
      string should not contain executable code and that is why stringify
      refuses to convert it.

      In JavaScript, functions are objects of class Function. As objects,
      they can be referenced by variables. What you usually refer to as the
      'function name' is a concept that really doesn't exist in JavaScript, a
      function is referred to by the name of the variable that is pointing to
      it. As any other object, you can copy a reference to that instance of
      the Function object (ie: the (lowercase) function) from one variable to
      the next. The method toString of class Function renders the body of the
      function. As you can see in your alert() below, there is no name as
      part of the function since functions have no intrinsic names. The ()
      operator, applied to an instance of a Function object, executes it.
      Trye this:

      var tree_struct_x = tree.getTreeDefinition;
      alert(tree_struct_x());

      See the parenthesis within the alert? The first statement copies a
      reference to the function, not the result of executing it so
      tree_struct_x now becomes a 'function' (actually, a new reference to the
      same Function instance) which you can execute at any time by appending
      the parenthesis to it. Anyway, this is not what you want to do, it was
      just to prove the point. You simply put the parenthesis in the first
      statement as shown above.

      Satyam

      Lee.M wrote:
      > On Nov 2, 2008, at 1:53 AM, Satyam wrote:
      >
      >
      >> Cookies have to be strings or things that have string representations.
      >> The string representation of an object is "[object]"which is not very
      >> useful.
      >>
      >> You have to use the JSON utility to convert the tree definition to a
      >> string and store that string into the cookie. On the way back, you
      >> read
      >> the cookie, parse it with the JSON utility and use that as the second
      >> argument to the TreeView constructor.
      >>
      >>
      >
      > Thanks again :) I had also tried that but this is the result:
      >
      > All of this is in <head> along with the treeview and cookie .js's:
      >
      > <script type="text/javascript" src="http://yui.yahooapis.com/2.6.0/build/yahoo/yahoo-min.js
      > "></script>
      > <script type="text/javascript" src="http://yui.yahooapis.com/2.6.0/build/json/json-min.js
      > "></script>
      > ...
      > var tree_struct_x = tree.getTreeDefinition;
      > alert(tree_struct_x);
      > var tree_data_string_x =
      > YAHOO.lang.JSON.stringify(tree_struct_x);
      > alert(tree_data_string_x);
      > ...
      >
      > 1st alert is:
      > function ()
      > {
      > return this.getRoot().getNodeDefinition();
      > }
      >
      > 2nd one is:
      > undefined
      >
      > Seems om as per: http://developer.yahoo.com/yui/json/#stringify
      >
      > What am I doing wrong ?
      >
      > TIA!
      >
      > Lee.M
      >
      > ------------------------------------
      >
      > Yahoo! Groups Links
      >
      >
      >
      > ------------------------------------------------------------------------
      >
      >
      > No virus found in this incoming message.
      > Checked by AVG - http://www.avg.com
      > Version: 8.0.175 / Virus Database: 270.8.5/1762 - Release Date: 02/11/2008 9:51
      >
      >
    • Lee.M
      ... Great thanks! That makes sense now :) Now the trouble is: a) the saved data is one step behind because tree.subscribe( expand ,... and
      Message 2 of 21 , Nov 3, 2008
      • 0 Attachment
        On Nov 3, 2008, at 3:05 AM, Satyam wrote:

        > You are missing the empty parenthesis at the end of getTreeDefinition,
        > it should be:
        >
        > var tree_struct_x = tree.getTreeDefinition();
        >
        > Without the parenthesis you are not assigning the tree definition to
        > tree_struct_x, which is what you want, but you are assigning it a
        > reference to the function, thus the alert is showing the string
        > representation of that function itself, which is its code.
        >

        Great thanks! That makes sense now :)

        Now the trouble is:
        a) the saved data is one step behind because
        'tree.subscribe("expand",...' and 'tree.subscribe("collapse",...'
        happen before it is changed so the data struct does not reflect the
        change we are about to do yet.. I've changed it to
        'tree.subscribe("clickEvent",...' but it still seems to be a step
        behind...

        I'd like to get all expand and collapses regardless of how they are
        triggered so I'm thinking this logic:

        tree.subscribe("expand", function(node) {
        var tree_struct = tree.getTreeDefinition();
        // modify node's expanded or collapsed state in tree_struct here
        // save tree_struct to cookie

        tree.subscribe("collapse", function(node) {
        ...

        Does that sound about right? I've been unsuccessful thus far with the
        'modify node's expanded or collapsed state in tree_struct here' any
        ideas?

        b) Once I get around "a" by doing an operation on another node so
        the previous change is saved:

        When the data struct has 'expanded = true' it is indeed re-rendered
        from the cookie as expanded. The problem is collapses are not
        remembered...

        Does it need an explicit 'expanded = false' ? if so, what do i do to
        make that happen?

        Again, thanks a ton!
      • Satyam
        ... expand is triggered before the change is made, but you also have expandComplete, fired afterwards. ... expanded = false and no expanded at all is the
        Message 3 of 21 , Nov 3, 2008
        • 0 Attachment
          Lee.M wrote:
          > On Nov 3, 2008, at 3:05 AM, Satyam wrote:
          >
          >
          >> You are missing the empty parenthesis at the end of getTreeDefinition,
          >> it should be:
          >>
          >> var tree_struct_x = tree.getTreeDefinition();
          >>
          >> Without the parenthesis you are not assigning the tree definition to
          >> tree_struct_x, which is what you want, but you are assigning it a
          >> reference to the function, thus the alert is showing the string
          >> representation of that function itself, which is its code.
          >>
          >>
          >
          > Great thanks! That makes sense now :)
          >
          > Now the trouble is:
          > a) the saved data is one step behind because
          > 'tree.subscribe("expand",...' and 'tree.subscribe("collapse",...'
          > happen before it is changed so the data struct does not reflect the
          > change we are about to do yet.. I've changed it to
          > 'tree.subscribe("clickEvent",...' but it still seems to be a step
          > behind...
          >
          > I'd like to get all expand and collapses regardless of how they are
          > triggered so I'm thinking this logic:
          >
          > tree.subscribe("expand", function(node) {
          > var tree_struct = tree.getTreeDefinition();
          > // modify node's expanded or collapsed state in tree_struct here
          > // save tree_struct to cookie
          >
          > tree.subscribe("collapse", function(node) {
          > ...
          >
          > Does that sound about right? I've been unsuccessful thus far with the
          > 'modify node's expanded or collapsed state in tree_struct here' any
          > ideas?
          >
          expand is triggered before the change is made, but you also have
          expandComplete, fired afterwards.
          > b) Once I get around "a" by doing an operation on another node so
          > the previous change is saved:
          >
          > When the data struct has 'expanded = true' it is indeed re-rendered
          > from the cookie as expanded. The problem is collapses are not
          > remembered...
          >
          > Does it need an explicit 'expanded = false' ? if so, what do i do to
          > make that happen?
          >
          >
          'expanded = false' and no 'expanded' at all is the same, after all, no
          'expanded' means 'expanded = undefined' which equates to false anyway.
          The method to extract each node definition tries to avoid being too
          verbose by omitting defaults or implicit values.

          Satyam


          > Again, thanks a ton!
          >
          >
          >
          > ------------------------------------
          >
          > Yahoo! Groups Links
          >
          >
          >
          > ------------------------------------------------------------------------
          >
          >
          > No virus found in this incoming message.
          > Checked by AVG - http://www.avg.com
          > Version: 8.0.175 / Virus Database: 270.8.5/1762 - Release Date: 02/11/2008 9:51
          >
          >
        • Lee.M
          ... I didn t see expandComplete/collapseComplete at http://developer.yahoo.com/yui/treeview/ thanks! ... That s the problem, rebuilding said tree seems to
          Message 4 of 21 , Nov 3, 2008
          • 0 Attachment

            but you also have expandComplete, fired afterwards.


            I didn't see expandComplete/collapseComplete at http://developer.yahoo.com/yui/treeview/ thanks!

            > When the data struct has 'expanded = true' it is indeed re-rendered 
            > from the cookie as expanded. The problem is collapses are not 
            > remembered...
            >
            > Does it need an explicit 'expanded = false' ? if so, what do i do to 
            > make that happen?
            >

            'expanded = false' and no 'expanded' at all is the same, after all, no 
            'expanded' means 'expanded = undefined' which equates to false anyway. 
            The method to extract each node definition tries to avoid being too 
            verbose by omitting defaults or implicit values.

            That's the problem, rebuilding said tree seems to ignore expanded =fals

            I can get it to save the stringified tree into a cookie on expand and collapse.

            the only values ever re-applied via the cookie are ones that were expanded.

            step 1) visit page w/ 2 nodes - both collapsed (IE default) - without the cookie
            [no alert]

            step 2) expand node 1
            alert: expandComplete
            [{"children":[{"children":[{"label":"item 0-0-0","type":"TextNode"},{"label":"item 0-0-1","type":"TextNode"}],"label":"List 0-0","type":"TextNode"}],"expanded":true,"label":"List 0","type":"TextNode"},{"children":[{"children":[{"label":"item 0-1-0","type":"TextNode"},{"label":"item 0-1-1","type":"TextNode"}],"href":"HTTP://developer.yahoo.com/yui","label":"YUI","target":"_new","title":"go to YUI Home Page","type":"TextNode"}],"label":"item 0-1","type":"TextNode"}]

            step 3) revisit page, node 1 is expanded! ye haw!
            alert: Reinstantiate from cookie
            [{"children":[{"children":[{"label":"item 0-0-0","type":"TextNode"},{"label":"item 0-0-1","type":"TextNode"}],"label":"List 0-0","type":"TextNode"}],"expanded":true,"label":"List 0","type":"TextNode"},{"children":[{"children":[{"label":"item 0-1-0","type":"TextNode"},{"label":"item 0-1-1","type":"TextNode"}],"href":"HTTP://developer.yahoo.com/yui","label":"YUI","target":"_new","title":"go to YUI Home Page","type":"TextNode"}],"label":"item 0-1","type":"TextNode"}]

            step 4) collapse node 1
            alert: collapseComplete
            [{"children":[{"children":[{"label":"item 0-0-0","type":"TextNode"},{"label":"item 0-0-1","type":"TextNode"}],"label":"List 0-0","type":"TextNode"}],"expanded":true,"label":"List 0","type":"TextNode"},{"children":[{"children":[{"label":"item 0-1-0","type":"TextNode"},{"label":"item 0-1-1","type":"TextNode"}],"href":"HTTP://developer.yahoo.com/yui","label":"YUI","target":"_new","title":"go to YUI Home Page","type":"TextNode"}],"label":"item 0-1","type":"TextNode"}]

            step 5) revisit page, node 1 is expanded still
            alert: Reinstantiate from cookie
            [{"children":[{"children":[{"label":"item 0-0-0","type":"TextNode"},{"label":"item 0-0-1","type":"TextNode"}],"label":"List 0-0","type":"TextNode"}],"expanded":true,"label":"List 0","type":"TextNode"},{"children":[{"children":[{"label":"item 0-1-0","type":"TextNode"},{"label":"item 0-1-1","type":"TextNode"}],"href":"HTTP://developer.yahoo.com/yui","label":"YUI","target":"_new","title":"go to YUI Home Page","type":"TextNode"}],"label":"item 0-1","type":"TextNode"}]
          • Satyam
            Congratulations, you have found a bug! Fortunately it is easy to patch, simply add this code to your page somewhere after the YUI library is loaded and before
            Message 5 of 21 , Nov 4, 2008
            • 0 Attachment
              Congratulations, you have found a bug!

              Fortunately it is easy to patch, simply add this code to your page
              somewhere after the YUI library is loaded and before you create the
              first TreeView instance:

              (function () {
              var oldGetNodeDefinition = YAHOO.widget.Node.prototype.getNodeDefinition;
              YAHOO.widget.Node.prototype.getNodeDefinition = function () {
              var def = oldGetNodeDefinition.call(this);
              if (!this.expanded) {delete def.expanded;}
              return def;
              };
              })();


              Do you mind filing a bug report in SourceForge? That's the way to ensure
              the YUI team keeps track of it and you will be notified whenever it gets
              fixed.

              http://developer.yahoo.com/yui/articles/reportingbugs/


              Satyam


              Lee.M wrote:
              >>
              >> but you also have expandComplete, fired afterwards.
              >>
              >
              > I didn't see expandComplete/collapseComplete
              > at http://developer.yahoo.com/yui/treeview/ thanks!
              >>
              >> > When the data struct has 'expanded = true' it is indeed re-rendered
              >> > from the cookie as expanded. The problem is collapses are not
              >> > remembered...
              >> >
              >> > Does it need an explicit 'expanded = false' ? if so, what do i do to
              >> > make that happen?
              >> >
              >> >
              >> 'expanded = false' and no 'expanded' at all is the same, after all, no
              >> 'expanded' means 'expanded = undefined' which equates to false anyway.
              >> The method to extract each node definition tries to avoid being too
              >> verbose by omitting defaults or implicit values.
              >>
              > That's the problem, rebuilding said tree seems to ignore expanded =fals
              >
              > I can get it to save the stringified tree into a cookie on expand and
              > collapse.
              >
              > the only values ever re-applied via the cookie are ones that were
              > expanded.
              >
              > *step 1) visit page w/ 2 nodes - both collapsed (IE default) - without
              > the cookie*
              > [no alert]
              >
              > *step 2) expand node 1*
              > alert: expandComplete
              > [{"children":[{"children":[{"label":"item
              > 0-0-0","type":"TextNode"},{"label":"item
              > 0-0-1","type":"TextNode"}],"label":"List
              > 0-0","type":"TextNode"}],"expanded":true,"label":"List
              > 0","type":"TextNode"},{"children":[{"children":[{"label":"item
              > 0-1-0","type":"TextNode"},{"label":"item
              > 0-1-1","type":"TextNode"}],"href":"HTTP://developer.yahoo.com/yui
              > <HTTP://develo%0Aper.yahoo.com/yui>","label":"YUI","target":"_new","title":"go
              > to YUI Home Page","type":"TextNode"}],"label":"item
              > 0-1","type":"TextNode"}]
              >
              > *step 3) revisit page, node 1 is expanded! ye haw!*
              > alert: Reinstantiate from cookie
              > [{"children":[{"children":[{"label":"item
              > 0-0-0","type":"TextNode"},{"label":"item
              > 0-0-1","type":"TextNode"}],"label":"List
              > 0-0","type":"TextNode"}],"expanded":true,"label":"List
              > 0","type":"TextNode"},{"children":[{"children":[{"label":"item
              > 0-1-0","type":"TextNode"},{"label":"item
              > 0-1-1","type":"TextNode"}],"href":"HTTP://developer.yahoo.com/yui","label":"YUI","target":"_new","title":"go
              > to YUI Home Page","type":"TextNode"}],"label":"item
              > 0-1","type":"TextNode"}]
              >
              > *step 4) collapse node 1*
              > alert: collapseComplete
              > [{"children":[{"children":[{"label":"item
              > 0-0-0","type":"TextNode"},{"label":"item
              > 0-0-1","type":"TextNode"}],"label":"List
              > 0-0","type":"TextNode"}],"expanded":true,"label":"List
              > 0","type":"TextNode"},{"children":[{"children":[{"label":"item
              > 0-1-0","type":"TextNode"},{"label":"item
              > 0-1-1","type":"TextNode"}],"href":"HTTP://developer.yahoo.com/yui","label":"YUI","target":"_new","title":"go
              > to YUI Home Page","type":"TextNode"}],"label":"item
              > 0-1","type":"TextNode"}]
              >
              > *step 5) revisit page, node 1 is expanded still*
              > alert: Reinstantiate from cookie
              > [{"children":[{"children":[{"label":"item
              > 0-0-0","type":"TextNode"},{"label":"item
              > 0-0-1","type":"TextNode"}],"label":"List
              > 0-0","type":"TextNode"}],"expanded":true,"label":"List
              > 0","type":"TextNode"},{"children":[{"children":[{"label":"item
              > 0-1-0","type":"TextNode"},{"label":"item
              > 0-1-1","type":"TextNode"}],"href":"HTTP://developer.yahoo.com/yui","label":"YUI","target":"_new","title":"go
              > to YUI Ho me Page","type":"TextNode"}],"label":"item
              > 0-1","type":"TextNode"}]
              >
              > ------------------------------------------------------------------------
              >
              >
              > No virus found in this incoming message.
              > Checked by AVG - http://www.avg.com
              > Version: 8.0.175 / Virus Database: 270.8.5/1764 - Release Date: 03/11/2008 7:46
              >
              >
            • Lee.M
              ... Cool :) ... Works like a charm, thanks! ... My associate, Daniel Muey, filed it for me since he s the one that was getting it working for us and he d be in
              Message 6 of 21 , Nov 4, 2008
              • 0 Attachment
                On Nov 4, 2008, at 4:41 AM, Satyam wrote:
                > Congratulations, you have found a bug!
                >
                Cool :)
                > Fortunately it is easy to patch, simply add this code to your page
                > somewhere after the YUI library is loaded and before you create the
                > first TreeView instance:
                >
                > (function () {
                > var oldGetNodeDefinition =
                > YAHOO.widget.Node.prototype.getNodeDefinition;
                > YAHOO.widget.Node.prototype.getNodeDefinition = function () {
                > var def = oldGetNodeDefinition.call(this);
                > if (!this.expanded) {delete def.expanded;}
                > return def;
                > };
                > })();
                >
                Works like a charm, thanks!
                > Do you mind filing a bug report in SourceForge? That's the way to
                > ensure
                > the YUI team keeps track of it and you will be notified whenever it
                > gets
                > fixed.
                >

                My associate, Daniel Muey, filed it for me since he's the one that was
                getting
                it working for us and he'd be in a better position to watch/assist
                with it.

                https://sourceforge.net/tracker/index.php?func=detail&aid=2221151&group_id=165715&atid=836476

                Thanks again for your time and assistance on this Satyam.
                > http://developer.yahoo.com/yui/articles/reportingbugs/
                >
                > Satyam
                >
              • rovangju
                If you d like to use markup I ve done a modification to treeview here: http://tech.groups.yahoo.com/group/ydn-javascript/message/40721 I really really want to
                Message 7 of 21 , Nov 18, 2008
                • 0 Attachment
                  If you'd like to use markup I've done a modification to treeview here:

                  http://tech.groups.yahoo.com/group/ydn-javascript/message/40721

                  I really really want to push this around so it, or something that does
                  the same thing gets put into an official release.
                • malutanpetronel
                  I ve also tried without success to expand some nodes with a property stored in string like bellow : tree.subscribe( expandComplete , function(node, string) {
                  Message 8 of 21 , Mar 21, 2009
                  • 0 Attachment
                    I've also tried without success to expand some nodes with a property stored in string like bellow :

                    tree.subscribe("expandComplete", function(node, string) {
                    tree.unsubscribe("expandComplete");
                    for(var i=0; i < node.children.length; i++){
                    var pozid = node.children[i].oData.pozid;
                    alert(","+pozid+",");
                    if(string.indexOf(pozid)!=-1){
                    node.children[i].expand();
                    }
                    }
                    });

                    drawFirstLevel();

                    for(var i=0; i < tree.getRoot().children.length; i++){
                    var node = tree.getRoot().children[i];
                    var pozid = node.oData.pozid;
                    if(string.indexOf(pozid)!=-1){
                    node.expand();
                    }
                    }

                    but no success! Any ideea ?
                  • Satyam
                    Nodes don t have any oData property but a data property.
                    Message 9 of 21 , Mar 21, 2009
                    • 0 Attachment
                      Nodes don't have any oData property but a "data" property.



                      malutanpetronel escribió:
                      > I've also tried without success to expand some nodes with a property stored in string like bellow :
                      >
                      > tree.subscribe("expandComplete", function(node, string) {
                      > tree.unsubscribe("expandComplete");
                      > for(var i=0; i < node.children.length; i++){
                      > var pozid = node.children[i].oData.pozid;
                      > alert(","+pozid+",");
                      > if(string.indexOf(pozid)!=-1){
                      > node.children[i].expand();
                      > }
                      > }
                      > });
                      >
                      > drawFirstLevel();
                      >
                      > for(var i=0; i < tree.getRoot().children.length; i++){
                      > var node = tree.getRoot().children[i];
                      > var pozid = node.oData.pozid;
                      > if(string.indexOf(pozid)!=-1){
                      > node.expand();
                      > }
                      > }
                      >
                      > but no success! Any ideea ?
                      >
                      >
                      >
                      > ------------------------------------
                      >
                      > Yahoo! Groups Links
                      >
                      >
                      >
                      > ------------------------------------------------------------------------
                      >
                      >
                      > No virus found in this incoming message.
                      > Checked by AVG - www.avg.com
                      > Version: 8.0.238 / Virus Database: 270.11.22/2015 - Release Date: 03/20/09 19:01:00
                      >
                      >
                    • malutanpetronel
                      Dear Satyam In my example oData had somehow same value as data. But that is really not solving my problem : I ve tried add something like
                      Message 10 of 21 , Mar 22, 2009
                      • 0 Attachment
                        Dear Satyam

                        In my example oData had somehow same value as data.
                        But that is really not solving my problem :

                        I've tried add something like
                        while(!node.completeRender()){
                        }
                        in order to wait for dynamic nodes to be renedered and only after that to continue to check if children nodes need to be expanded or not according to string.

                        function expandState(node,string){
                        for(var i=0; i < node.children.length; i++){
                        pozid = node.children[i].data.pozid;
                        if(string.indexOf(pozid)!=-1){
                        node.children[i].expand();
                        expandState(node.children[i], string);
                        }
                        }
                        }
                        for(var i=0; i < root.children.length; i++){
                        var node = root.children[i];
                        var pozid = node.data.pozid;
                        if (string.indexOf(pozid)!=-1){
                        node.expand();
                        while(!node.completeRender()){
                        }
                        expandState(node, string);
                        }
                        }

                        Pleae show me how this should be done.

                        With kind regards

                        Petronel
                      • malutanpetronel
                        Anyhow Satyam The solution with setTimeout works for me, as you discussed in a other tread! For sure is not so perfect as the onexpandComplete but maybe is it
                        Message 11 of 21 , Mar 23, 2009
                        • 0 Attachment
                          Anyhow Satyam
                          The solution with setTimeout works for me, as you discussed in a other tread! For sure is not so perfect as the onexpandComplete but maybe is it easier to understand.
                        Your message has been successfully submitted and would be delivered to recipients shortly.