如何获取XUL树类型复选框的行值JavaScript

How to get the rows value of the type check-box XUL tree JavaScript

本文关键字:复选框 类型 JavaScript XUL 何获取 获取      更新时间:2023-09-26

我是XUL新手;javascript编程。

我刚刚意识到我完全在一个错误的方向,在合并两行之前,用户必须选择他们想要合并的值。我想在一个单独的窗口用下拉菜单显示这些值。

我有一个"type="checkbox" xul树,该树是使用XML树模板形成的。

  1. 如何获取对应行的选中复选框的值(从选中的行中获取文本)复选框是使用CSS实现的

<treecol type="checkbox" label="CheckBox" editable="true"/>

2。我有一个下拉菜单,我想在那里显示树单元格值的选定行。

我如何获得选择复选框树行值的值并动态地将其附加到下拉菜单中?请朋友们指导我。

这是我的XUL树代码:
tree editable="true" id="myTodoListTree" flex="1" seltype="multiple"
datasources="file://C:/mercredi.xml" ref="*" querytype="xml" enableColumnDrag="true">
        <treecols>
        <treecol type="checkbox" label="CheckBox" editable="true"/>
        <treecol sortActive="true" sort="?name" id="name" label="FirstName" flex="1" persist="width ordinal hidden"  sortDirection="ascending"/>
               <splitter class="tree-splitter" />                   
            <treecol sortActive="true" sort="?lastname" id="lastname" label="LastName" flex="1" persist="width ordinal hidden" sortDirection="ascending"/>
                <splitter class="tree-splitter" />                    
            <treecol sortActive="true" sort="?gmail" id="gmail" label="Gmail" flex="1" persist="width ordinal hidden"  sortDirection="ascending"/>
                <splitter class="tree-splitter" />
        </treecols> 
 </tree>
 <row>
<label  value="FirstName"/>
<label  value="LastName"/>
<label  value="Gmail"/>
</row>
    <row>
   <menulist id="firstname">
    <menupopup >
    </menupopup>
    </menulist>
     </row>
</window>

首先,我试图得到所选行的值,它不工作:https://developer.mozilla.org/en/XUL/tree

function getCellChecked(tree, columnid)
{
alert('1');
  var arr = [];
  var column = tree.columns.getNamedColumn(columnid);
  for (var i = 0; i < tree.view.rowCount; i++){
    if (tree.view.getCellValue(i, column) == 'true')
      arr.push(i);
  }
  return arr;
  alert('final'+arr);
}
css文件:
treechildren::-moz-tree-checkbox(checked)
{
  list-style-image: url("chrome://global/skin/checkbox/cbox-check.gif");
}
treechildren::-moz-tree-checkbox(disabled)
{
  list-style-image: url("chrome://global/skin/checkbox/cbox-check-dis.gif")
}
[url=http://postimage.org/image/2t1lnsczo/][img]http://s1.postimage.org/2t1lnsczo/jeudi1.jpg[/img][/url]

在这个问题上折腾了2天后,终于在朋友的帮助下解决了这个问题。Firefox网站上的一些文档不太容易理解,也没有适当的示例。

解决方案如下:该函数用于获取选中复选框树行的值,并将这些值附加到菜单列表中。树的类型是"复选框",它是使用CSS实现的。

我们可以通过getNamedColumn方法tree.columns.getNamedColumn()获得树的行值。

然后使用getCellValue()方法获取所选行(行)的值(文本内容)

 function merge()
    {
      var tree = document.getElementById('myTodoListTree');//Id of the tree
      for (var i = 0; i < tree.view.rowCount; i++) {
      if (tree.view.getCellValue(i, tree.columns.getColumnAt(0)) == 'true') 
//To get the cell values of the entire row, if the check-box is selected(True)// 
{
    alert(
    tree.view.getCellText(i, tree.columns.getNamedColumn("name"))+"'n"+
    tree.view.getCellText(i, tree.columns.getNamedColumn("lastname")));
//Testing my output with alert message.
//Appending my output to my menu-list.  
  var firstName= tree.view.getCellText(i, tree.columns.getNamedColumn("name"));
    var menu = document.getElementById("firstname");
      menu.appendItem(firstName);
    var lastName= tree.view.getCellText(i, tree.columns.getNamedColumn("lastname"));
    var menu = document.getElementById("laastname");
      menu.appendItem(lastName);
        }
      }
      return arr;  
    }