Nested Content Tree Using Custom Tree View

classic Classic list List threaded Threaded
3 messages Options
Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Nested Content Tree Using Custom Tree View

reverendlinux-2
I have a tree that is currently a standard content tree; three columns for multiple rows of data.  The basic code is as follows:

<tree
        editable="false"
        id="comicsTree"
        enableColumnDrag="true"
        hidecolumnpicker="true"
        seltype="multiple"
        flex="1">

<treecol id="pub" label="Publisher" flex="2"persist="width ordinal" />
<splitter />
<treecol id="title" label="Title" persist="width ordinal" />
<splitter />
<treecol id="series" label="Series" persist="width ordinal" />



I populate the tree children using JavaScript like this (the data is in an a array called comicsArr).

var formatData = {
  rowCount : comicsArr.length,
  getCellText : function(row,column) {
    var line = comicsArr.split("\t");
      switch (column.id) {
        case "pub":
          return line[0];
        case "title":
          return line[1];
        case "series":
          return line[2];
        default :
          return false;
      } // end switch
    },
  setTree: function(treebox){this.treebox = treebox;},
  isContainer: function(row){return false;},
  isSeparator: function(row){return false;},
  isSorted: function(row){return false;},
  getLevel: function(row){return 0;},
  getImageSrc: function(row,col){return null;},
  getRowProperties: function(row,props){},
  getCellProperties: function(row,col,props){},
  getColumnProperties: function(colid,col,props){}
}

document.getElementById(comicsTree).view=formatData;


This all works fine.  However, what I want to do is modify my tree such that the content is nested.  I.E. - All comics published by Marvel will be nested under the row Marvel.  Likewise, all titles of the same name, say Captain America, will be under the nested row Captain America, listed by Series.

My problem is: how do I get the custom tree view to do this or is it even possible?  I've tried about two dozen different approaches to this and can't get anything to work.  Can anyone out there point me in the right direction?

Thanks in advance,
 - JPR
_______________________________________________
dev-tech-xul mailing list
[hidden email]
https://lists.mozilla.org/listinfo/dev-tech-xul
Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: Nested Content Tree Using Custom Tree View

Neil-4
[hidden email] wrote:

>My problem is: how do I get the custom tree view to do this or is it even possible?  I've tried about two dozen different approaches to this and can't get anything to work.  Can anyone out there point me in the right direction?
>  
>
Once you start nesting rows things get very complicated very quickly.
The relevant methods are:

    * rowCount: Must be kept up to date as parent rows are opened and closed
    * isContainer: Must return true for parent rows. (Can return true
      for child rows if isContainerEmpty returns true too.)
    * getParentIndex: Returns -1 for top-level rows.
    * hasNextSibling: Must return true if a parent has a sibling. Note
      that afterIndex will be one of its descendant rows, this may or
      may not be useful for you.
    * getLevel: Must return the depth (indentation) of the row
    * toggleOpenState: Called on non-empty parent rows when the [+] is
      clicked. Must call treeBoxObject.rowCountChanged to notify the
      tree of how many rows were added or removed.

Of course you also need to remember to set the primary="true" attribute
on one of your tree columns.

There are a number of wrappers that do some of the legwork for you, for
instance this is one I wrote about 10 years ago:
http://pastebin.mozilla.org/4618616 (note that these days you need to
install that file as part of an extension but as I recall the original
version worked in Netscape 7 and probably even Firefox 1.0 too).

--
Warning: May contain traces of nuts.
_______________________________________________
dev-tech-xul mailing list
[hidden email]
https://lists.mozilla.org/listinfo/dev-tech-xul
Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: Nested Content Tree Using Custom Tree View

reverendlinux-2
In reply to this post by reverendlinux-2
On Monday, March 17, 2014 5:11:20 PM UTC-6, [hidden email] wrote:

> I have a tree that is currently a standard content tree; three columns for multiple rows of data.  The basic code is as follows:
>
>
>
> <tree
>
> editable="false"
>
> id="comicsTree"
>
> enableColumnDrag="true"
>
> hidecolumnpicker="true"
>
> seltype="multiple"
>
> flex="1">
>
>
>
> <treecol id="pub" label="Publisher" flex="2"persist="width ordinal" />
>
> <splitter />
>
> <treecol id="title" label="Title" persist="width ordinal" />
>
> <splitter />
>
> <treecol id="series" label="Series" persist="width ordinal" />
>
>
>
>
>
>
>
> I populate the tree children using JavaScript like this (the data is in an a array called comicsArr).
>
>
>
> var formatData = {
>
>   rowCount : comicsArr.length,
>
>   getCellText : function(row,column) {
>
>     var line = comicsArr.split("\t");
>
>       switch (column.id) {
>
>         case "pub":
>
>           return line[0];
>
>         case "title":
>
>           return line[1];
>
>         case "series":
>
>           return line[2];
>
>         default :
>
>           return false;
>
>       } // end switch
>
>     },
>
>   setTree: function(treebox){this.treebox = treebox;},
>
>   isContainer: function(row){return false;},
>
>   isSeparator: function(row){return false;},
>
>   isSorted: function(row){return false;},
>
>   getLevel: function(row){return 0;},
>
>   getImageSrc: function(row,col){return null;},
>
>   getRowProperties: function(row,props){},
>
>   getCellProperties: function(row,col,props){},
>
>   getColumnProperties: function(colid,col,props){}
>
> }
>
>
>
> document.getElementById(comicsTree).view=formatData;
>
>
>
>
>
> This all works fine.  However, what I want to do is modify my tree such that the content is nested.  I.E. - All comics published by Marvel will be nested under the row Marvel.  Likewise, all titles of the same name, say Captain America, will be under the nested row Captain America, listed by Series.
>
>
>
> My problem is: how do I get the custom tree view to do this or is it even possible?  I've tried about two dozen different approaches to this and can't get anything to work.  Can anyone out there point me in the right direction?
>
>
>
> Thanks in advance,
>
>  - JPR

Neil,

As always, you're a tremendous resource.  Your code example is exactly what I'm looking for.

I have it running in a test dialog.  I just need to work my way through it to understand what's going on and modify it to my purposes.

Thanks for the help.
 - JPR
_______________________________________________
dev-tech-xul mailing list
[hidden email]
https://lists.mozilla.org/listinfo/dev-tech-xul
Loading...