Question

我正在使用RadTreeView，这是一个很好的控制我有一个小问题，我希望你可以帮助我我已经创建了一个下一个按钮和一个搜索文本框，用户在文本框中输入首选搜索条件并点击下一个。

当他点击Next 时，我搜索TreeView并在TreeView节点中找到第一个匹配项并将其选中，当他再次单击Next时，我想找到同一节点的下一个匹配项并将其选中。

我怎么能实现这一点谢谢:)我希望它可以作为客户端，如果可能的话

到目前为止，这是我的代码：

<script type="text/javascript">
function FindMatchingNodes() {

            var tree = $find("<%=MainTree.ClientID%>");
            var text = document.getElementById("<%=ApplicationSearchResult.ClientID%>").value;
            var allNodes = tree.get_allNodes();

            var array = new Array();
            staticVar();
           for (var i = 0; i < allNodes.length; i++) {
                var node = allNodes[i];
                var itemText = node.get_text();
                var itemValue = node.get_value();

               if (text != "") {
                   if (text == itemText) {
                        array.push(itemValue);
                    }
                }
            }
            if (staticVar.counter >= array.length) { staticVar.counter = 0; }
          var SelectedNode =tree.findNodeByValue(array[staticVar.counter].toString());
            var pNode = SelectedNode.get_parent();
            SelectedNode.select();
            pNode.set_expanded(true);
            SelectedNode.set_expanded(true);
            array = null;

        }

        function staticVar() {
            if (staticVar.counter == undefined) {
                staticVar.counter = 0        
            }
            else {
                staticVar.counter++
            }
        }
</script>

//标记

  <telerik:RadTreeView ID="MainTree" runat="server" CssClass="NewClass" 
        Skin="Office2010Silver">
    <Nodes>
    <telerik:RadTreeNode Selected="true" Text="Hello"  Value="0">
        <Nodes>
            <telerik:RadTreeNode runat="server" Text="Hi" Value="1">
            </telerik:RadTreeNode>
        </Nodes>
        </telerik:RadTreeNode>
    <telerik:RadTreeNode  Text="Hellooooooooooooo" Value="2">
        <Nodes>
            <telerik:RadTreeNode runat="server" Text="helloooo" Value="3">
            </telerik:RadTreeNode>
        </Nodes>
        </telerik:RadTreeNode>
<telerik:RadTreeNode runat="server" Owner="MainTree" Text="Hi" Value="4"></telerik:RadTreeNode>
<telerik:RadTreeNode runat="server" Owner="MainTree" Text="Hiiiiiiiiiiiiiii" Value="5"></telerik:RadTreeNode>
<telerik:RadTreeNode runat="server" Owner="MainTree" Text="Hello" Value="6" 
            ></telerik:RadTreeNode>
    </Nodes>
    <Nodes>
    <telerik:RadTreeNode  Text="Hi" Value="7"></telerik:RadTreeNode>
    <telerik:RadTreeNode  Text="Hiiiiiiiiiiiiiii" Value="8"></telerik:RadTreeNode>
    <telerik:RadTreeNode  Text="Hello" Value="9"></telerik:RadTreeNode>
    </Nodes>
    </telerik:RadTreeView>
    <table border="0">
    <tr>
    <td><telerik:RadTextBox ID="ApplicationSearchResult" runat="server">
   <ClientEvents OnKeyPress="KeyPress" />
    </telerik:RadTextBox></td>
     <td><img src="next.png" onclick="FindMatchingNodes();" style="cursor:pointer;" runat="server" height="17" width="17" ID="NextNode" /></td>
      </tr>
      </table>

Answer 1

function findNext() {
     var search = $get("<%= ApplicationSearchResult.ClientID %>").value;

     var treeView = $find("<%= MainTree.ClientID %>");
     var selectedNode = treeView.get_selectedNode();
     var nodes = treeView.get_allNodes();
     var index = selectedNode ? nodes.indexOf(selectedNode) + 1 : 0;
     for (var itemsProcessed = 0; itemsProcessed < nodes.length; ++itemsProcessed, ++index) {
          if (index >= nodes.length)
               index = 0;

          var node = nodes[index];
          if (node.get_text() == search) {
               if (selectedNode) {
                    selectedNode.unselect();
               }
               node.select();
               expandAllAncestors(node);
               return;
          }

     }
}

function expandAllAncestors(node) {
     if (node.get_expanded() !== true)
          node.expand();

     if (node.get_level() != 0) {
          expandAllAncestors(node.get_parent());
     }
}

RadTreeView节点循环

1 个答案: