I have asp.net gridview control on a webform, which i used to add, edit and delete records of invoice list with four fields of AgreementNO(txtRANO), Invoice No(txtInvNo),Dispute Date(txtDisputeDate), Amount(txtInvAmount).User can add, edit and delete records as required.
I'm trying to validate the text boxes inside grid view item template and edit item template using jQuery since either txtInvNo and txtDisputeDate will have a value per record.
I can identify the text boxes in side empty and footer template as it will be single row and the ID of textboxes doesn't change dynamically.
But the ID s of textboxes changes for example txtInvNo_0,txtInvNo_1 and so on depend on number of rows, and jQuery could not identify using $(this).closest("tr").find("[id$=txtRANumber]") method.
I looked for many examples, and suggested to use css class and identifu each textbox with its css class name. I have applied same css class for all textboxes.
is there any proper way to do this, other wise will end up in number of css class as unique class name required. code below.
<asp:GridView ID="grdCNoteRADetailAdd" runat="server" AutoGenerateColumns="false"
ShowFooter="true" CssClass="grdMain" GridLines="None" DataKeyNames="CNRecID"
OnRowEditing="EditRADetail" OnRowUpdating="UpdateRADetail" OnRowCancelingEdit="CancelEditRADetail"
Width="100%">
<HeaderStyle CssClass="grdheader" />
<RowStyle CssClass="grdItem" VerticalAlign="Top" />
<AlternatingRowStyle CssClass="grdaltItem" VerticalAlign="Top" />
<FooterStyle VerticalAlign="Top" />
<Columns>
<asp:TemplateField HeaderText="RA Number" HeaderStyle-Width="25%" ItemStyle-CssClass="grdItemborder">
<ItemTemplate>
<asp:Label ID="lblRANumber" runat="server" Text='<%# Eval("RANumber")%>'></asp:Label>
</ItemTemplate>
<EditItemTemplate>
<asp:TextBox ID="txtRANumber" runat="server" Text='<%# Eval("RANumber")%>' CssClass="txtbox1" ValidationGroup="edRa"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="!"
Display="Dynamic" CssClass="rqrdtxt" ControlToValidate="txtRANumber" ValidationGroup="edRa"></asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="RegularExpressionValidator4" runat="server" ErrorMessage="!"
Display="Dynamic" CssClass="rqrdtxt" ControlToValidate="txtRANumber" ValidationExpression="[a-zA-Z0-9\s]+$" ValidationGroup="edRa"></asp:RegularExpressionValidator>
</EditItemTemplate>
<FooterTemplate>
<tr>
<td style="width: 25%;">
<asp:TextBox ID="txtRANumber" runat="server" CssClass="txtbox1" Width="90%"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator7" runat="server" ErrorMessage="!"
Display="Dynamic" CssClass="rqrdtxt" ControlToValidate="txtRANumber" ValidationGroup="newNRA"></asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="RegularExpressionValidator5" runat="server" ErrorMessage="!" ValidationGroup="newNRA"
Display="Dynamic" CssClass="rqrdtxt" ControlToValidate="txtRANumber" ValidationExpression="[a-zA-Z0-9\s]+$"></asp:RegularExpressionValidator>
</td>
<td style="width: 25%;">
<asp:TextBox ID="txtInvNo" runat="server" CssClass="txtbox2" Width="90%" ValidationGroup="newNRA"></asp:TextBox>
<asp:RegularExpressionValidator ID="revInvNo" runat="server"
ErrorMessage="!" Display="Dynamic" CssClass="rqrdtxt" ControlToValidate="txtInvNo" ValidationGroup="newNRA"
ValidationExpression="^(ri|RI|STI|sti|TI|ti|RIR|rir|OSTI|osti)?\d{7,15}$"></asp:RegularExpressionValidator>
</td>
<td style="width: 20%;">
<asp:TextBox ID="txtDisputeDate" runat="server" CssClass="txtbox2JQDP" Width="75%"></asp:TextBox>
</td>
<td style="width: 20%;">
<asp:TextBox ID="txtCreditAmount" runat="server" CssClass="txtbox1" Width="85%" ValidationGroup="newNRA"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator5" runat="server" ErrorMessage="!"
Display="Dynamic" CssClass="rqrdtxt" ControlToValidate="txtCreditAmount" ValidationGroup="newNRA"></asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="RegularExpressionValidator9" runat="server" ErrorMessage="!" ValidationGroup="newNRA"
Display="Dynamic" CssClass="rqrdtxt" ControlToValidate="txtCreditAmount" ValidationExpression="^\d+(\.\d{1,2})?$"></asp:RegularExpressionValidator>
</td>
<td style="width: 10%;">
<asp:Button ID="btnAddRF" runat="server" Text="Add" OnClick="AddNewRADetail" ValidationGroup="newNRA"/>
</td>
</tr>
<tr>
<td></td>
<td class="tdsubhead2" style="text-align: center;">Total
</td>
<td>
<asp:Label ID="lblCNoteTotal" runat="server" Text=""></asp:Label>
</td>
<td></td>
</tr>
</FooterTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderStyle-Width="25%" HeaderText="Invoice No" ItemStyle-HorizontalAlign="Center"
HeaderStyle-CssClass="grdItemborder" ItemStyle-CssClass="grdItemborder">
<ItemTemplate>
<asp:Label ID="lblInvNo" runat="server" Text='<%# Eval("InvoiceNo")%>'></asp:Label>
</ItemTemplate>
<EditItemTemplate>
<asp:TextBox ID="txtInvNo" runat="server" Text='<%# Eval("InvoiceNo")%>' CssClass="txtbox2" Width="95%" ValidationGroup="edRa"></asp:TextBox>
<asp:RegularExpressionValidator ID="revInvNo" runat="server"
ErrorMessage="!" Display="Dynamic" CssClass="rqrdtxt" ControlToValidate="txtInvNo"
ValidationExpression="^(ri|RI|STI|sti|TI|ti|RIR|rir|OSTI|osti)?\d{7,15}$" ValidationGroup="edRa"></asp:RegularExpressionValidator>
</EditItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderStyle-Width="20%" HeaderText="Dispute Date" ItemStyle-HorizontalAlign="Center"
HeaderStyle-CssClass="grdItemborder" ItemStyle-CssClass="grdItemborder">
<ItemTemplate>
<asp:Label ID="lblDispute_Date" runat="server" Text='<%# Eval("Dispute_Date")%>'></asp:Label>
</ItemTemplate>
<EditItemTemplate>
<asp:Label ID="lblDisputeDate" runat="server" Text='<%# Eval("Dispute_Date")%>' Visible='<%# IIf(Eval("IsInvoice") = True, True, False)%>'></asp:Label>
<asp:TextBox ID="txtDisputeDate" runat="server" CssClass="txtbox2JQDP" Width="75%" Text='<%# Eval("Dispute_Date")%>' Visible='<%# If(Eval("IsInvoice") = True, False, True)%>'></asp:TextBox>
</EditItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderStyle-Width="20%" HeaderText="Credit Amount" HeaderStyle-CssClass="grdItemborder"
ItemStyle-CssClass="grdItemborder">
<ItemTemplate>
<asp:Label ID="lblCreditAmount" runat="server" Text='<%# Eval("CNAmount")%>'></asp:Label>
</ItemTemplate>
<EditItemTemplate>
<asp:TextBox ID="txtCreditAmount" runat="server" Text='<%# Eval("CNAmount")%>' CssClass="txtbox1" Width="90%" ValidationGroup="edRa"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator5" runat="server" ErrorMessage="!" ValidationGroup="edRa"
Display="Dynamic" CssClass="rqrdtxt" ControlToValidate="txtCreditAmount"></asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="RegularExpressionValidator8" runat="server" ErrorMessage="!"
Display="Dynamic" CssClass="rqrdtxt" ControlToValidate="txtCreditAmount" ValidationExpression="^\d+(\.\d{1,2})?$" ValidationGroup="edRa"></asp:RegularExpressionValidator>
</EditItemTemplate>
<FooterTemplate>
</FooterTemplate>
</asp:TemplateField>
<%--<asp:CommandField ShowEditButton="True" />--%>
<asp:TemplateField ShowHeader="False" HeaderStyle-Width="10%">
<ItemTemplate>
<asp:LinkButton ID="lnkEdit" runat="server" CausesValidation="False" CommandName="Edit"
Text="Edit" ValidationGroup="vgEdit"></asp:LinkButton>
</ItemTemplate>
<EditItemTemplate>
<table style="width: 100%">
<tr>
<td>
<asp:LinkButton ID="lnkUpdate" runat="server" CausesValidation="True" CommandName="Update"
Text="Update" ValidationGroup="edRa"></asp:LinkButton>
</td>
<td>
<asp:LinkButton ID="lnkRemoveRF" runat="server" CommandArgument='<%# Eval("CNRecID")%>'
Text="Delete" OnClick="DeleteRADetail" CausesValidation="false"></asp:LinkButton>
</td>
<td>
<asp:LinkButton ID="lnkCancel" runat="server" CausesValidation="False" CommandName="Cancel"
Text="Cancel"></asp:LinkButton>
</td>
</tr>
</table>
</EditItemTemplate>
<HeaderStyle Width="5%" />
</asp:TemplateField>
<%--<asp:TemplateField HeaderStyle-Width="10%" HeaderStyle-CssClass="grdItemborder" ItemStyle-CssClass="grdItemborder">
<ItemTemplate>
<asp:LinkButton ID="lnkRemoveRF" runat="server" CommandArgument='<%# Eval("CNRecID")%>'
Text="Delete" OnClick="DeleteRADetail" CausesValidation="false"></asp:LinkButton>
</ItemTemplate>
</asp:TemplateField>--%>
</Columns>
<EmptyDataTemplate>
<tr>
<td class="tdsubhead2" style="width: 25%; text-align: center;">RA Number
</td>
<td class="tdsubhead2" style="width: 25%; text-align: center;">Invoice No
</td>
<td class="tdsubhead2" style="width: 20%; text-align: center;">Dispute Date
</td>
<td class="tdsubhead2" style="width: 20%; text-align: center;">Credit Amount
</td>
<td style="border: 0px solid grey; width: 10%;"></td>
</tr>
<tr>
<td style="text-align: center">
<asp:TextBox ID="txtRANumber" runat="server" CssClass="txtbox1" ValidationGroup="newRa" Width="90%" />
<asp:RequiredFieldValidator ID="RequiredFieldValidator7" runat="server" ErrorMessage="!"
Display="Dynamic" CssClass="rqrdtxt" ControlToValidate="txtRANumber" ValidationGroup="newRa"></asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="RegularExpressionValidator10" runat="server"
ErrorMessage="!" Display="Dynamic" CssClass="rqrdtxt" ControlToValidate="txtRANumber"
ValidationExpression="[a-zA-Z0-9\s]+$" ValidationGroup="newRa"></asp:RegularExpressionValidator>
</td>
<td style="vertical-align: top; text-align: center">
<asp:TextBox ID="txtInvNo" runat="server" CssClass="txtbox2" ValidationGroup="newRa" Width="90%" />
<asp:RegularExpressionValidator ID="revInvNo" runat="server"
ErrorMessage="!" Display="Dynamic" CssClass="rqrdtxt" ControlToValidate="txtInvNo"
ValidationExpression="^(ri|RI|STI|sti|TI|ti|RIR|rir|OSTI|osti)?\d{7,15}$" ValidationGroup="newRa"></asp:RegularExpressionValidator>
</td>
<td style="vertical-align: top; text-align: center">
<asp:TextBox ID="txtDisputeDate" runat="server" CssClass="txtbox2JQDP" Width="75%"></asp:TextBox>
</td>
<td style="text-align: center">
<asp:TextBox ID="txtCreditAmount" runat="server" CssClass="txtbox1" Width="75%" ValidationGroup="newRa" />
<asp:RequiredFieldValidator ID="RequiredFieldValidator9" runat="server" ErrorMessage="!"
ValidationGroup="newRa" Display="Dynamic" CssClass="rqrdtxt" ControlToValidate="txtCreditAmount"></asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="RegularExpressionValidator12" runat="server"
ErrorMessage="!" Display="Dynamic" CssClass="rqrdtxt" ControlToValidate="txtCreditAmount"
ValidationExpression="^\d+(\.\d{1,2})?$" ValidationGroup="newRa"></asp:RegularExpressionValidator>
</td>
<td style="width: 10%">
<asp:Button ID="btnAddRF" runat="server" Text="Add" OnClick="AddNewRADetail" CommandName="emptyInsert"
CausesValidation="true" CssClass="buttonScreenSpec" ValidationGroup="newRa" />
</td>
</tr>
<tr>
<td></td>
<td></td>
<td class="tdsubhead2" style="text-align: center;">Total
</td>
<td>
<asp:Label ID="lblCNoteTotal" runat="server" Text=""></asp:Label>
</td>
<td></td>
</tr>
</EmptyDataTemplate>
</asp:GridView>
JQuery Code Below/ /Add New Record
$("[id$=grdCNoteRADetailAdd] [id$=btnAddRF]").click(function () {
var raRow = $(this).closest("tr");
alert($(this).closest("tr input[type='text']").length);
var txtRaNo = raRow.find("[id$=txtRANumber]");
var txtInvNo = raRow.find("[id$=txtInvNo]");
var txtDisDate = raRow.find("[id$=txtDisputeDate]");
if ($.trim(txtRaNo.val()) != "")
{
if ($.trim(txtInvNo.val()) == "" && $.trim(txtDisDate.val()) == "")
{
var msg = "Both Invoive No and Dispute Date cannot be empty.\nIf system generated invoice is not available, specify the date when was the dispute happend.\n ";
msg += "For example : Date when the tarffic fine was charged directly to customer by police..!"
alert(msg);
return false;
}
}
return true;
});
//Edit Record using Update Link button
//This does not work as txtRANumber,txtInvNo and txtDisputeDate are dynamically gaving index at the end as txtDisputeDate_0,1 etc based on number of rows in the grid
$('#<%=grdCNoteRADetailAdd.ClientID %> a:contains(Update)').click(function () {
var raRow = $(this).closest("tr");
var txtRaNo = raRow.find("[id$=txtRANumber]");
var txtInvNo = raRow.find("[id$=txtInvNo]");
var txtDisDate = raRow.find("[id$=txtDisputeDate]");
alert(txtRaNo.attr("id"));
if ($.trim(txtRaNo.val()) != "") {
if ($.trim(txtInvNo.val()) == "" && $.trim(txtDisDate.val()) == "") {
//alert('fuck2');
var msg = "Both Invoive No and Dispute Date cannot be empty.\nIf system generated invoice is not available, specify the date when was the dispute happend.\n ";
msg += "For example : Date when the tarffic fine was charged directly to customer by police..!"
alert(msg);
return false;
}
}
return true;
});
