Waqas
Waqas

Reputation: 867

How to validate textbox in gridview when checkbox is checked in same row of gridview using javascript asp.net

i have gridview in my aspx page as

 <asp:GridView ID="Grid_FeeCategory" Width="100%" CssClass="table table-striped responsive-utilities jambo_table" runat="server" AutoGenerateColumns="False">
    <HeaderStyle CssClass="headings" /> 
    <Columns>
    <asp:TemplateField>
    <HeaderTemplate>
    <asp:CheckBox ID="checkAll" runat="server" onclick = "checkAll(this);" />
    </HeaderTemplate>
    <ItemTemplate>
    <asp:CheckBox ID="chkRow" runat="server" onclick = "Check_Click(this)"/>
    </ItemTemplate>
    </asp:TemplateField>
    <asp:BoundField DataField="CatName" HeaderText="Category" />
    <asp:TemplateField HeaderText="Category Fee" HeaderStyle-Width="125px">
    <ItemTemplate>
    <asp:TextBox ID="txtCatFee" runat="server" placeholder="Int or Decimal" style="width:100%" />
   </ItemTemplate>
    </asp:TemplateField>
    <asp:BoundField DataField="FeeCatID" HeaderText="Category ID" HeaderStyle-CssClass="hidden-field" ItemStyle-CssClass="hidden-field"/>
    </Columns> 

    </asp:GridView>

and my custom validator looks like

<asp:CustomValidator ID="CustomValidator1" runat="server" ErrorMessage="Please enter value"
    ClientValidationFunction="Validate" ForeColor="Red"></asp:CustomValidator> 

i need to validate textbox in gridview when checkbox in the gridview is checked and user leave textbox empty

e-g if user check the checkbox from row 1 of gridview and also leave textbox empty in row 1 and so on.. then custom validator inform to enter value,

for this i got javascript yesterday from google and manipulate it but it does nothing and here is javascript

<script type="text/javascript">
         function Validate(sender, args) {
             var gridView = document.getElementById("<%=Grid_FeeCategory.ClientID %>");

             var fields= gridView.getElementsByTagName("input");

             for (var i = 0; i < fields.length; i++)
             {

                 if (fields[i].type == "fields" && fields[i].checked)
                 {

                     if (fields[i].type == "text" && fields[i].value.length < 1)
                     {

                         args.IsValid = false;
                             return;

                       }

                 }
             }
             args.IsValid = true;
         }
         </script>

i check it by using alerts inside script and it cannot enter into this section of javascript

if (fields[i].type == "text" && fields[i].value.length < 1)
                     {

                         args.IsValid = false;
                         return;

                       }

It is requirement to do this at client side using javascript so i need your help to get out of it

Upvotes: 2

Views: 2513

Answers (1)

Ehsan Waris
Ehsan Waris

Reputation: 148

i know this is late one but any one can get help from following function....

I have example related to your logic. you can do this on client side ... following code is not exactly your requirement but you can manipulate it according to your requirement .

<script type="text/javascript">
function validate() {
            var flag = false;
            var gridView = document.getElementById('<%= Grid_FeeCategory.ClientID %>');

    for (var i = 1; i < gridView.rows.length; i++) {
        var inputs = gridView.rows[i].getElementsByTagName('input');

        if (inputs != null && inputs.length > 1 && inputs[0] != null) {
            if (inputs[1].type == "text" && inputs[0].type == "checkbox") {
                var txtval = inputs[1].value;
                if (inputs[0].checked && (txtval == "" || txtval == null)) {

                    flag = false;
                    break;
                }
                else {
                    flag = true
                }
            }
        }
    }
    if (!flag) {

            new PNotify({
                title: 'Error',
                text: 'Please provide values for "CHECKED" fee categories....!',
                type: 'error',
                hide: true
            });


    }

    return flag;
}
</script>

and button where you can call above function

<asp:Button ID="btnCalculate"  runat="server"OnClientClick="if(!validate()) { return false;}" OnClick="btnCalculate_Click"  Text="Calculate" ValidationGroup="Update"/>

if you need any kind of query to understand then please feel free to ask

Upvotes: 3

Related Questions