javascript - 在 ASP.NET Web 表单应用程序中使用 jquery 选中复选框时将隐藏字段设置为某个值

Question

从使用 .NET Framework 2.0 使用 Jquery 版本 1.8.2 使用 ASP.NET GridView 控件的 ASP.NET Web 表单应用程序 ASP.NET 页面。

当我单击“自动检查”、“自动电子转帐”或“手动”这 3 个复选框中的任何一个时，我需要能够将隐藏字段设置:hidIsDirty 为值“true”。请告诉我如何使用 JQuery 实现此目的，因为我在 jquery 中编写了以下代码，该代码没有设置隐藏字段的值。我将访问隐藏字段(aspx.cs)中的代码。

你能帮我重构我的jquery代码并帮助我实现3个复选框的要求吗？

代码如下:

  <script>
      $("[id*=rdoSAPPaymentAuto]").live("click", function () {
             var parentRow = $(this).parent('tr');
                        var hiddenField=parentRow.find('input[id$=hidIsDirty]');
                        alert(hiddenField.val("true"));
        });

           $("#<%=gvPaymentList.ClientID %> input[id*='rdoSAPPaymentAuto']").click(function () {
                        var parentRow = $(this).parent('tr');
                        var hiddenField=parentRow.find('input[id$=hidIsDirty]');
                        alert(hiddenField.val("true"));
        });

         $("#<%=gvPaymentList.ClientID %> input[id*='rdoSAPPaymentAutoEFT']").click(function () {
                        var parentRow = $(this).parent('tr');
                        var hiddenField=parentRow.find('input[id$=hidIsDirty]');
                        alert(hiddenField.val("true"));
        });

        $("#<%=gvPaymentList.ClientID %> input[id*='rdoSAPPaymentManual']").click(function () {
                        var parentRow = $(this).parent('tr');
                        var hiddenField=parentRow.find('input[id$=hidIsDirty]');
                       alert(hiddenField.val("true"));
        });

    </script>

    WebForm.aspx page:

    <asp:GridView ID="gvPaymentList" runat="server" CellPadding="0" EmptyDataText="No payments found."
                        CssClass="green greenBorder setpadding" AutoGenerateColumns="false" OnRowDataBound="gvPaymentList_RowDataBound"
                        AllowSorting="true" AlternatingRowStyle-CssClass="altRowColor" RowStyle-CssClass="RowColor"
                        OnSorting="gvPaymentList_Sorting" ShowFooter="false">
                        <Columns>
     <asp:TemplateField>
                                <HeaderTemplate>
                                    Approve for SAP Auto Payment or Manual Pay Req
                                    <input id="btnAutoPayment" value="Set All to Auto Payment" type="button" />
                                </HeaderTemplate>                          
                                <ItemTemplate>
                                    <asp:CustomValidator ID="cvAutoPayCheck3" runat="server" OnServerValidate="cvAutoPayCheck_ServerValidate">*</asp:CustomValidator>
                                  <asp:RadioButton ID="rdoSAPPaymentAuto" GroupName="SAPPaymentOption" runat="server"
                                        AutoPostBack="true" OnCheckedChanged="rdoSAPPaymentAuto_CheckedChanged" Text="Auto-Cheque" />
                                    <asp:RadioButton ID="rdoSAPPaymentAutoEFT" GroupName="SAPPaymentOption" OnCheckedChanged="rdoSAPPaymentAutoEFT_CheckedChanged" runat="server"
                                        AutoPostBack="true" Text="Auto-EFT" />
                                    <asp:RadioButton ID="rdoSAPPaymentManual" GroupName="SAPPaymentOption" runat="server" 
                                        AutoPostBack="true" OnCheckedChanged="rdoSAPPaymentManual_CheckedChanged" Text="Manual" />                              
                                    <asp:RadioButton ID="rdoSAPPaymentPending" GroupName="SAPPaymentOption" runat="server"
                                        Text="Pending" />
                                    <asp:HiddenField ID="hidSAPPayment" runat="server" />
                                    <asp:HiddenField ID="hidIsDirty" runat="server" />
                                </ItemTemplate>
                                <ItemStyle Width="310px" />
                            </asp:TemplateField> 
     </Columns>
                    </asp:GridView>        

Answer 1

这是可行的解决方案 为您的单选按钮添加 CssClass，例如:

<asp:RadioButton ID="rdoSAPPaymentAuto" GroupName="SAPPaymentOption" runat="server"
                                    Text="Auto-Cheque" CssClass="rdo" />
                                <asp:RadioButton ID="rdoSAPPaymentAutoEFT" GroupName="SAPPaymentOption"  runat="server"
                                    Text="Auto-EFT" CssClass="rdo" />
                                <asp:RadioButton ID="rdoSAPPaymentManual" GroupName="SAPPaymentOption" runat="server" 
                                      Text="Manual" CssClass="rdo" /> 

下面的小 Jscript 就可以解决问题

$('.rdo').click(function () {                                      
                var parentRow = $(this).closest('tr');
                alert($(parentRow).html());                    
                var hiddenField = $(parentRow).find('input[type="hidden"]:first');                                       
                alert($(hiddenField).val('true'));
            })

注意:请更改隐藏字段的顺序(因为我正在获取第一个隐藏字段)...有点懒，但您可以按 Id 找到隐藏字段...

 <asp:HiddenField ID="hidIsDirty" runat="server" />
 <asp:HiddenField ID="hidSAPPayment" runat="server" />

希望这有帮助!