Прочитайте текстовые поля внутри EditItemTemplate Gridview и проверьте с помощью jQuery
У меня есть элемент управления gridview asp.net на веб-форме, который я использовал для добавления, редактирования и удаления записей списка счетов с четырьмя полями AgreementNO(txtRANO), Invoice No(txtInvNo),Dispute Date(txtDisputeDate), Amount(txtInvAmount)
Пользователь может добавлять, редактировать и удалять записи по мере необходимости.
Я пытаюсь проверить текстовые поля внутри шаблона элемента сетки и отредактировать шаблон элемента с помощью jQuery, так как txtInvNo и txtDisputeDate будут иметь значение для каждой записи.
Я могу определить текстовые поля в пустом и нижнем колонтитулах, так как это будет одна строка, а идентификатор текстовых полей не изменяется динамически.
Но идентификаторы текстовых полей меняются, например, txtInvNo_0,txtInvNo_1 и т. Д. Зависят от количества строк, и jQuery не может определить с помощью $(this).closest("tr").find("[id$=txtRANumber]")
метод.
Я искал много примеров и предложил использовать класс CSS и идентифицировать каждое текстовое поле с его именем класса CSS. Я применил один и тот же класс CSS для всех текстовых полей.
Есть ли какой-либо правильный способ сделать это, в противном случае в конечном итоге в число классов CSS в качестве уникального имени класса требуется. код ниже.
<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 ниже / / Добавить новую запись
$("[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;
});
1 ответ
Я нашел ответ на этот вопрос и опубликовать здесь, чтобы помочь другим.
Примечание: 1. В текстовом поле, помещенном внутри, будет создан динамический идентификатор как " textboxName (number)". Поэтому JQuery не будет идентифицировать текстовое поле, используя его идентификатор.
Я добавил имя класса css (такое же как идентификатор текстового поля) вместе с реальным именем класса css. например, мой текстовое поле ID ="txtRANumber" и CssClass="txtRANumber txtbox1". здесь txtbox1 является классом css, а класс txtRANumber, который я добавил, чтобы идентифицировать текстовое поле, используя его имя класса, используя извлечение кода JQuery.Gridview и извлечение кода JQuery, приведены ниже.
$("[id*=grdCNoteRADetailAdd] [id*=lnkUpdate]").click(function () {
var raNo = $('.txtRANumber').val(); // txtRANumber text box identifiied using its css class name
var invNo = $('.txtInvNo').val();
var disDate = $('.txtbox2JQDP').val();
if ($.trim(raNo) == "") {
var msg="Enter RA number"
alert(msg);
return false;
}
}
return true;
});
<EditItemTemplate>
<asp:TextBox ID="txtRANumber" runat="server" Text='<%# Eval("RANumber")%>' CssClass="txtRANumber 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>