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
  • Lee.M
    ... Thanks again :) I had also tried that but this is the result: All of this is in along with the treeview and cookie .js s:
    Message 1 of 21 , Nov 2, 2008
      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
    • 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 2 of 21 , Nov 3, 2008
        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 3 of 21 , Nov 3, 2008
          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 4 of 21 , Nov 3, 2008
            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 5 of 21 , Nov 3, 2008

              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 6 of 21 , Nov 4, 2008
                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 7 of 21 , Nov 4, 2008
                  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 8 of 21 , Nov 18, 2008
                    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 9 of 21 , Mar 21, 2009
                      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 10 of 21 , Mar 21, 2009
                        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 11 of 21 , Mar 22, 2009
                          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 12 of 21 , Mar 23, 2009
                            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.