How user not allow to select the tristatecheckboxes "

2 posts, 1 answers
  1. Aravind
    Aravind avatar
    41 posts
    Member since:
    Jun 2013

    Posted 01 Nov 2013 Link to this post

    hai
    i read the following ariticle https://demos.telerik.com/aspnet-ajax/treeview/examples/functionality/checkboxes/defaultcs.aspx
    in the we use tristateheckboxes,if inner node partial checked it show partial checked color in check box,if select all check box then wee see tick mark in tristatecheckbox.
    but my need is use not allow to check and uncheck the tristatecheckbox,bcz now if check tristatecheckbox ,its child node all checked,if uncheck tristatecheck ,its child node all are unchecked.

    Why i am ask this ,i have  restriction for check child node upto 3 by using javascript.means i have to count no, of nodes checked from db and apply in hidden field,and from OnClientNodeChecked i will increase or decrease node selected count and apply in same hidden field.if hidden field count more than 3 it show msg and remove lastly selected node like that.

    now what i get problem if user click tristatecheckbox ,its child nodes all are checked ,so i cant count the  nodes and apply in hidden filed. 
    below code i use in client side

            function onClientNodeClickedHandler(sender, eventArgs) {
                var tree = $find("<%= RadTreeView1.ClientID %>");
                var childNodes = eventArgs.get_node().get_text();
                var chnode = tree.findNodeByText(childNodes);
                var node = eventArgs.get_node();
                var nodetext = eventArgs._node.get_text();
                if (nodetext == "Software" || nodetext == "Books" || nodetext == "Music" || nodetext == "Movies"
    ) {
                    // node.toggle()-- nothing affect its child node check boxes like select all or unselect all

                  }
                else {
                 
                    if (node.get_checked() == true) {
                
                        var hdFldLang = document.getElementById("ctl00_ContentPlaceHolder1_hdLangCount").value;
                        if (hdFldLang < 3) {

                            if (hdFldLang == "") {
                                hdFldLang = 1;
                            }
                            else {
                                var Add = parseInt(hdFldLang);
                                hdFldLang = Add + 1;
                            }

                            document.getElementById("ctl00_ContentPlaceHolder1_hdLangCount").value = hdFldLang;

                                            }
                        else {

                         
                                alert("Maximum of 20 language is allowed")
                            }

                            chnode.uncheck()

                        }
                    }
                    else {
                            var hdFldLang1 = document.getElementById("ctl00_ContentPlaceHolder1_hdLangCount").value;
                            var sub = parseInt(hdFldLang1)
                            hdFldLang1 = sub - 1;
                            document.getElementById("ctl00_ContentPlaceHolder1_hdLangCount").value = hdFldLang1;
                        
                    }
                }
            

    Note: user not allow to tounch tristatecheckbox ,only to show paritially or fully selected mark, and also i need that tristatecheckbox

    Regards
      Aravinb
  2. Answer
    Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 01 Nov 2013 Link to this post

    Hi Aravind,

    I guess you want to get the count of the CheckBoxes Checked and to check only the first three ChildNodes. Please have a look into the following code snippet which works as expected.

    ASPX:
    <telerik:RadTreeView ID="RadTreeView1" runat="server" TriStateCheckBoxes="true" CheckBoxes="true"
        OnClientNodeChecked="OnClientNodeChecking">
        <Nodes>
            <telerik:RadTreeNode Text="Node1" runat="server">
                <Nodes>
                    <telerik:RadTreeNode Text="Node1" runat="server">
                    </telerik:RadTreeNode>
                    <telerik:RadTreeNode Text="Node2" runat="server">
                    </telerik:RadTreeNode>
                    <telerik:RadTreeNode Text="Node3" runat="server">
                    </telerik:RadTreeNode>
                    <telerik:RadTreeNode Text="Node4" runat="server">
                    </telerik:RadTreeNode>
                    <telerik:RadTreeNode Text="Node5" runat="server">
                    </telerik:RadTreeNode>
                </Nodes>
            </telerik:RadTreeNode>
            <telerik:RadTreeNode Text="Node2" runat="server">
                <Nodes>
                    <telerik:RadTreeNode Text="Node1" runat="server">
                    </telerik:RadTreeNode>
                    <telerik:RadTreeNode Text="Node2" runat="server">
                    </telerik:RadTreeNode>
                    <telerik:RadTreeNode Text="Node3" runat="server">
                    </telerik:RadTreeNode>
                    <telerik:RadTreeNode Text="Node4" runat="server">
                    </telerik:RadTreeNode>
                </Nodes>
            </telerik:RadTreeNode>
        </Nodes>
    </telerik:RadTreeView>

    JavaScript:
    <script type="text/javascript">
        function OnClientNodeChecking(sender, args) {
            if (args.get_node()._hasChildren()) {
                var count = args.get_node().get_nodes().get_count();
                if (count > 3) {
                    for (i = 3; i <= count; i++)
                        args.get_node().get_nodes().getItem(i).set_checked(false);
                }
            }
        }
    </script>

    Thanks,
    Shinu.

  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top