Maximum Checked Allow In Checkbox GridTemplateColumn/ItemTemplate

7 posts, 1 answers
  1. Ebenezer
    Ebenezer avatar
    39 posts
    Member since:
    Dec 2012

    Posted 14 Aug 2013 Link to this post

    How do I limit users to Check only 8 items in a CheckBox inside  GridTemplateColumn/ItemTemplate either by Client side or server side


    <telerik:GridTemplateColumn DataField ="ID" UniqueName="CheckBoxColumn">
                                                <ItemTemplate>     
                                                     <asp:CheckBox ID="CheckBoxStatus" runat="server"  />                                                                                                                                                      
                                                                                                    
                                               </ItemTemplate>
                                           </telerik:GridTemplateColumn>

  2. A2H
    A2H avatar
    177 posts
    Member since:
    Mar 2010

    Posted 14 Aug 2013 Link to this post

    Hi ,
    If you want to validate the count on checkbox click

    Please try this

    1)      Add a hidden filed to your aspx page
    <asasp:HiddenField ID="hdnCheckedCount" runat="server" Value="0" />

    2)
          Modify you template column like given below
    <tetelerik:GridTemplateColumn DataField="ID" UniqueName="CheckBoxColumn">
                                <ItemTemplate>
                                    <asp:CheckBox ID="CheckBoxStatus" runat="server" onClick="GetCheckedItemCount(this)" />
                                </ItemTemplate>
                            </telerik:GridTemplateColumn>

    3)
          Add the following javascript method

    function GetCheckedItemCount(objCheckbox) {
                    if (objCheckbox.checked == true) {
                        if (document.getElementById('<%=hdnCheckedCount.ClientID %>').value >= 8) {
                            alert('Please select only 8 rows');
                            objCheckbox.checked = false;
                        }
                        else {
                            document.getElementById('<%=hdnCheckedCount.ClientID %>').value = parseInt(document.getElementById('<%=hdnCheckedCount.ClientID %>').value) + 1;
                        }
                    }
                    else {
                        document.getElementById('<%=hdnCheckedCount.ClientID %>').value = parseInt(document.getElementById('<%=hdnCheckedCount.ClientID %>').value) - 1;
                    }
                }


    Thanks,
    A2H
  3. Answer
    A2H
    A2H avatar
    177 posts
    Member since:
    Mar 2010

    Posted 14 Aug 2013 Link to this post

    Hi,

    If you want to validate the checkbox checked count on a button click try this

    ASPX:

    <asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="GetCheckedItemCountbtnClick()" />
    Javascript:
    function GetCheckedItemCountbtnClick() {
                    var checkedcount = 0;
                    var grid = $find("<%=RadGrid1.ClientID %>");
                    for (var i = 0; i < grid.get_masterTableView().get_dataItems().length; i++) {
                        var objchkbox = grid.get_masterTableView().get_dataItems()[i].findElement("CheckBoxStatus");
                        if (objchkbox.checked) {
                            checkedcount++;
                        }
                    }
                    if (checkedcount > 8 ) {
                        alert("Please select only 8 rows");
                        return false;
                    }
                }


    Thanks,
    A2H

  4. Ebenezer
    Ebenezer avatar
    39 posts
    Member since:
    Dec 2012

    Posted 14 Aug 2013 Link to this post

    Hi A2H
    Thanks a lot. It works great
  5. Ebenezer
    Ebenezer avatar
    39 posts
    Member since:
    Dec 2012

    Posted 16 Aug 2013 Link to this post

    Hi A2H
    How do I use same great code you gave me to make sure that user's don't leave the checkboxes blank. I don't want users to leave the checked boxes blank. At least one item must be checked   but not more that 8
  6. A2H
    A2H avatar
    177 posts
    Member since:
    Mar 2010

    Posted 16 Aug 2013 Link to this post

    Hi,
    Please modify the JS function like given below
    function GetCheckedItemCountbtnClick() {
                    var checkedcount = 0;
                    var grid = $find("<%=RadGrid1.ClientID %>");
                    for (var i = 0; i < grid.get_masterTableView().get_dataItems().length; i++) {
                        var objchkbox = grid.get_masterTableView().get_dataItems()[i].findElement("CheckBoxStatus");
                        if (objchkbox.checked) {
                            checkedcount++;
                        }
                    }
                    if (checkedcount > 8) {
                        alert("Please select only 8 rows");
                        return false;
                    }
                    if (checkedcount == 0) {
                        alert("Please select atleast one row");
                        return false;
                    }
                }


    Thanks,
    A2H
  7. Ebenezer
    Ebenezer avatar
    39 posts
    Member since:
    Dec 2012

    Posted 16 Aug 2013 Link to this post

    Hi A2H
    Thanks a lot. It works great again
Back to Top