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

Question

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

当我点击自动支票、自动电子转帐或手动 3 个复选框中的任何一个时，我需要能够设置 hiddenfield : 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

我使用了我从上面的萨米（只有回答感谢的人！）上面得到的任何想法来获得最近的行。由于某种原因 .live 事件对我有用（但 .click 事件拒绝奇怪地工作），代码如下：

$("#<%=GRIDVIEW.ClientID %> input[id$='checkboxid']").live('click', function() {
                var parentRow = $(this).closest('tr');                                   
                var hiddenField = $(parentRow).find("input[id$='hidIsDirty']");                                      
                $(hiddenField).val('true');              

              });

Answer 2

这是可行的解决方案 为您的单选按钮放置 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" />

希望这会有所帮助！