zoukankan      html  css  js  c++  java
  • JQuery插件级联选择(适用于TreeView)

    首先,分析一下TreeView在客户端生成的html。TreeView中的checkbox的id是TreeView的id + n + 数字 + CheckBox,其下级的checkbox集合则是包含在将该checkbox的id中的CheckBox替换成Nodes的div中所有的checkbox集合。而其上级checkbox的id是将该checkbox的父div的id中的Nodes替换成CheckBox。先看截图:

    用法如下:

    CascadingSelect : function(container, node, target)
    当点击checkbox时调用这个方法,其中参数
    container:容器的ID,如果使用母版页请用ClientID
    node:包括key(关键字属性,一般使用checkbox的title属性),type(关键字类型,设置number表示数字,否则表示字符)
    target:存放所选checkbox的控件,一般使用HiddenField

    CascadingRefresh : function(container, node,  target)

    PostBack时刷新checkbox的选择状态,参数同上
    示例如下:

    <script type="text/javascript">
        $(
            
    function()
            
    {
                $().CascadingRefresh(
    "<%= this.TreeView1.ClientID %>"{key: "title", type: ""}"<%= this.ID.ClientID %>");
                
                $(
    "input[@type='checkbox']", $("#<%= this.TreeView1.ClientID %>")).click(
                    
    function()
                    
    {
                        $(
    this).CascadingSelect("<%= this.TreeView1.ClientID %>"{key: "title", type: ""}"<%= this.ID.ClientID %>");
                    }
    );
            }
    );
        
    </script>

        
    <asp:TreeView ID="TreeView1" runat="server">
            
    <Nodes>
                
    <asp:TreeNode ShowCheckBox="True" Text="1" Value="1">
                    
    <asp:TreeNode ShowCheckBox="True" SelectAction="None" Text="1.1" Value="1.1">
                        
    <asp:TreeNode ShowCheckBox="True" Text="1.1.1" Value="1.1.1"></asp:TreeNode>
                        
    <asp:TreeNode ShowCheckBox="True" Text="1.1.2" Value="1.1.2"></asp:TreeNode>
                    
    </asp:TreeNode>
                    
    <asp:TreeNode ShowCheckBox="True" Text="1.2" Value="1.2"></asp:TreeNode>
                    
    <asp:TreeNode ShowCheckBox="False" Text="1.3" Value="1.3">
                        
    <asp:TreeNode ShowCheckBox="True" Text="1.3.1" Value="1.3.1"></asp:TreeNode>
                        
    <asp:TreeNode ShowCheckBox="True" Text="1.3.2" Value="1.3.2"></asp:TreeNode>
                    
    </asp:TreeNode>
                
    </asp:TreeNode>
            
    </Nodes>
        
    </asp:TreeView>

    /Files/Zane/MultiSelect_20070618.rar

  • 相关阅读:
    reorder-list
    HMM基础
    binary-tree-preorder-traversal
    binary-tree-postorder-traversal
    GMM基础
    (七)打印机驱动设置—认识打印机接口
    (八)打印机驱动设置—串口的设置
    (五)打印机驱动设置—没有开不了的钱箱
    (六)打印机驱动设置—装完驱动后没有打印机图标
    (四)揭开打印机驱动的神秘面纱
  • 原文地址:https://www.cnblogs.com/Leo_wl/p/2338145.html
Copyright © 2011-2022 走看看