mozilla

Compare Revisions

tree

Change Revisions

Revision 72919:

Revision 72919 by karthikin on

Revision 72920:

Revision 72920 by karthikin on

Title:
tree
tree
Slug:
XUL/tree
XUL/tree
Tags:
"XUL Reference", "XUL Elements"
"XUL Reference", "XUL Elements"
Content:

Revision 72919
Revision 72920
n289      [code]n289       
290    </p>
290    </p>291    <pre>
291    <p style="margin-left: 40px;">
292      &lt;?xml version="1.0"?&gt;<br>292&lt;?xml version="1.0"?&gt;
293      &lt;?xml-stylesheet href="<a class=" external" href="chrome293&lt;?xml-stylesheet href="chrome://global/skin/" type="text/css"?
>://global/skin/" rel="freelink">chrome://global/skin/</a>" type=">&gt;
>text/css"?&gt;<br> 
294      &lt;?xml-stylesheet href="file://C:/main.css" type="text/cs294&lt;?xml-stylesheet href="file://C:/main.css" type="text/css"?&gt
>s"?&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbs>;                                    
>p;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nb 
>sp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&n 
>bsp;&nbsp;&nbsp;&nbsp;&nbsp;<br> 
295      &lt;window xmlns="<a class=" external" href="http://www.moz295&lt;window xmlns="http://www.mozilla.org/keymaster/gatekeeper/the
>illa.org/keymaster/gatekeeper/there.is.only.xul" rel="freelink">h>re.is.only.xul"&gt;
>ttp://www.mozilla.org/keymaster/gat...re.is.only.xul</a>"&gt;<br> 
296      <br>296 
297      &lt;row&gt;&lt;button label="GetRowValues" oncommand="getro297&lt;row&gt;&lt;button label="GetRowValues" oncommand="getrowcellv
>wcellvalues();"/&gt;&lt;/row&gt;<br>>alues();"/&gt;&lt;/row&gt;
298      &nbsp;&lt;tree flex="1" editable="true" id="mytree"&gt;<br>298 &lt;tree flex="1" editable="true" id="mytree"&gt;
299      <br>299 
300      &nbsp; &lt;treecols&gt;<br>300  &lt;treecols&gt;
301      &nbsp;&nbsp;&nbsp; &lt;treecol label="Active" type="checkbo301    &lt;treecol label="Active" type="checkbox" editable="true" /&
>x" editable="true" /&gt;<br>>gt;
302      &nbsp;&nbsp;&nbsp; &lt;treecol label="Name" flex="1" id="na302    &lt;treecol label="Name" flex="1" id="name"/&gt;
>me"/&gt;<br> 
303      &nbsp; &lt;/treecols&gt;<br>303  &lt;/treecols&gt;
304      <br>304 
305      &nbsp; &lt;treechildren&gt;<br>305  &lt;treechildren&gt;
306      &nbsp;&nbsp;&nbsp; &lt;treeitem&gt;<br>306    &lt;treeitem&gt;
307      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;treerow&gt;<br>307      &lt;treerow&gt;
308      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;treecell val308        &lt;treecell value="false"/&gt;
>ue="false"/&gt;<br> 
309      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;treecell lab309        &lt;treecell label="Alice"/&gt;
>el="Alice"/&gt;<br> 
310      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/treerow&gt;<br>
311      &nbsp;&nbsp;&nbsp; &lt;/treeitem&gt;<br>
312      &nbsp;&nbsp;&nbsp; &lt;treeitem&gt;<br>
313      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;treerow&gt;<br>
314      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;treecell val
>ue="false"/&gt;<br> 
315      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;treecell lab
>el="Bob"/&gt;<br> 
316      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/treerow&gt;<br>
317      &nbsp;&nbsp;&nbsp; &lt;/treeitem&gt;<br>
318      &nbsp; &lt;/treechildren&gt;<br>
319      <br>
320      &lt;/tree&gt;<br>310      &lt;/treerow&gt;
321      <br>311    &lt;/treeitem&gt;
312    &lt;treeitem&gt;
313      &lt;treerow&gt;
314        &lt;treecell value="false"/&gt;
315        &lt;treecell label="Bob"/&gt;
316      &lt;/treerow&gt;
317    &lt;/treeitem&gt;
318  &lt;/treechildren&gt;
319 
320&lt;/tree&gt;
321 
322      &lt;/window&gt;322&lt;/window&gt;
323</pre>
323    </p>324    <p>
324    <p>325      &nbsp;
325      [/code]
n331      [code]n331      &nbsp;
332    </p>
332    </p>333    <pre>
333    <p style="margin-left: 40px;">
334      treechildren::-moz-tree-checkbox<br>334treechildren::-moz-tree-checkbox
335      {<br>335{
336      &nbsp; /* unchecked checkbox treecells. This style MUST com336  /* unchecked checkbox treecells. This style MUST come before tr
>e before treechildren::-moz-tree-checkbox(checked) otherwise it w>eechildren::-moz-tree-checkbox(checked) otherwise it won't take e
>on't take effect. */<br>>ffect. */
337      &nbsp; list-style-image: url("")<br>337  list-style-image: url("")
338      }<br>338}
339      treechildren::-moz-tree-checkbox(checked)<br>339treechildren::-moz-tree-checkbox(checked)
340      {<br>340{
341      &nbsp; /* checked checkbox treecells. cbox-check.gif isn't 341  /* checked checkbox treecells. cbox-check.gif isn't available i
>available in<br>>n
342      &nbsp;&nbsp;&nbsp;&nbsp; Firefox 1, 2, and 3 in Mac OS X so342     Firefox 1, 2, and 3 in Mac OS X so you should specify a URL 
> you should specify a URL to an image<br>>to an image
343      &nbsp;&nbsp;&nbsp;&nbsp; in your extension or elsewhere. */343     in your extension or elsewhere. */
><br> 
344      &nbsp; list-style-image: url("<a class=" external" href="ch344  list-style-image: url("chrome://global/skin/checkbox/cbox-check
>rome://global/skin/checkbox/cbox-check.gif" rel="freelink">chrome>.gif");
>://global/skin/checkbox/cbox-check.gif</a>");<br> 
345      }<br>345}
346      treechildren::-moz-tree-checkbox(disabled)<br>346treechildren::-moz-tree-checkbox(disabled)
347      {<br>347{
348      &nbsp; /* disabled checkbox treecells. cbox-check.gif isn't348  /* disabled checkbox treecells. cbox-check.gif isn't available 
> available in<br>>in
349      &nbsp;&nbsp;&nbsp;&nbsp; Firefox 1, 2, and 3 in Mac OS X, s349     Firefox 1, 2, and 3 in Mac OS X, so you should specify a URL
>o you should specify a URL to an image<br>> to an image
350      &nbsp;&nbsp;&nbsp;&nbsp; in your extension or elsewhere. */350     in your extension or elsewhere. */
><br> 
351      &nbsp; list-style-image: url("<a class=" external" href="ch351  list-style-image: url("chrome://global/skin/checkbox/cbox-check
>rome://global/skin/checkbox/cbox-check-dis.gif" rel="freelink">ch>-dis.gif")
>rome://global/skin/checkbox/cbox-check-dis.gif</a>")<br> 
352      }<br>352}
353      <br>353 
354      treechildren::-moz-tree-row(selected)&nbsp;&nbsp;&nbsp;&nbs354treechildren::-moz-tree-row(selected)            { background-col
>p;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; { background-color: >or: #FFFFAA; }
>#FFFFAA; }<br> 
355      treechildren::-moz-tree-row(odd)&nbsp;&nbsp;&nbsp;&nbsp;&nb355treechildren::-moz-tree-row(odd)                 { background-col
>sp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&n>or: #EEEEEE; }
>bsp; { background-color: #EEEEEE; }<br> 
356      treechildren::-moz-tree-row(odd, selected)&nbsp;&nbsp;&nbsp356treechildren::-moz-tree-row(odd, selected)       { background-col
>;&nbsp;&nbsp;&nbsp; { background-color: #FFFFAA; }<br>>or: #FFFFAA; }
357      treechildren::-moz-tree-cell-text(selected)&nbsp;&nbsp;&nbs357treechildren::-moz-tree-cell-text(selected)      { color: #000000
>p;&nbsp;&nbsp; { color: #000000; }<br>>; }
358      treechildren::-moz-tree-cell-text(odd, selected) { color: #358treechildren::-moz-tree-cell-text(odd, selected) { color: #000000
>000000; }<br>>; }
359      treechildren::-moz-tree-row(hover) {background-color: #FFFF359treechildren::-moz-tree-row(hover) {background-color: #FFFFAA !im
>AA !important;}<br>>portant;}
360      <br>360 
361      treechildren:-moz-tree-column {<br>361treechildren:-moz-tree-column {
362      border-right:1px solid rgb(220,220,220) !important;<br>362border-right:1px solid rgb(220,220,220) !important;
363      }363}
364</pre>
364    </p>365    <p>
365    <p>366      &nbsp;
366      [/code]
t371    <p style="margin-left: 40px;">t371    <div>
372      <br>372      <pre>
373      function getrowcellvalues()<br>373function getrowcellvalues()
374      {<br>374{
375      //alert('hi');<br>375//alert('hi');
376      var tree = document.getElementById('mytree');<br>376var tree = document.getElementById('mytree');
377      for (var i = 0; i &lt; tree.view.rowCount; i++) {<br>377for (var i = 0; i &lt; tree.view.rowCount; i++) {
378      &nbsp;&nbsp; if (tree.view.getCellValue(i, tree.columns.get378   if (tree.view.getCellValue(i, tree.columns.getColumnAt(0)) == 
>ColumnAt(0)) == 'true'){<br>>'true'){
379      alert(tree.view.getCellText(i, tree.columns.getNamedColumn(379alert(tree.view.getCellText(i, tree.columns.getNamedColumn("name"
>"name")));<br>>)));
380      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }<br>380        }
381      &nbsp;&nbsp;&nbsp; }<br>381    }
382      <br>382 
383      }//To get the value of the row, we have to use two function383}//To get the value of the row, we have to use two functions getC
>s getCellTex(); &amp; getNamedColumn("name");&nbsp;>ellTex(); &amp; getNamedColumn("name"); 
384 
385 
386</pre>
384    </p>387    </div>
385    <p>
386      &nbsp;
387    </p>

Back to History