Jquery 启用和禁用 Asp.net 按钮

Question

我有一个 <asp:Button ID="BtnAddCart" runat="server" Text="Place Order" Width="147px" onclick="BtnAddCart_Click" Enabled="false"/>

以及gridview 上的复选框列和复选框标题。 在标题上，您选中复选框，网格上的所有项目都被选中。如果取消选中标题复选框，则网格上的项目不会被选中。

这里是 Jquery

  <script type="text/javascript">
    $(document).ready(function () {
        var chkBox = $("input[id$='ChkAll']");
        chkBox.click(
           function () {
               $("#MainContent_ProductGrid INPUT[type='checkbox']")
             .attr('checked', chkBox
              .is(':checked'));
               $("#MainContent_BtnAddCart INPUT[type='submit']").removeAttr('disabled');
           });
        // Uncheck      
        $("#MainContent_ProductGrid INPUT[type='checkbox']").click(
                    function (e) {
                        if (!$(this)[0].checked) {
                            chkBox.attr("checked", false);
                        }
                        $("#MainContent_BtnAddCart INPUT[type='submit']").attr('disabled', 'disabled');

                    });
    });
</script>

为什么按钮没有启用和禁用。

Answer 1

只是为了完整起见 - 这是打开和关闭 asp 按钮的方法。 在此示例中，我将按钮默认为禁用：

在 .aspx 中

<asp:Button ID="btnNext" runat="server" Text="Next" CssClass="cssBtnNext_Disabled" Enabled="false" />

在启用 jQuery 的 javaScript 中：

<script src="/js/jquery/jquery-1.4.2.min.js" type="text/javascript"></script>
<script language="javascript" type="text/javascript">

    $().ready(function()
    {
       var btnNext = $("#<%= btnNext.ClientID %>"); // get the ASP mangled id//$("#btnNext");
       btnNext.click(NextClicked);

       function NextClicked()
       {
          alert("NextClicked Fired!");
       }

       ToggleButtonEnable( IsEnabled )//IsEnabled is true or false
       { 
           if (IsEnabled )
           {//was disabled, now enable
          btnNext.removeAttr("disabled"); //enable button
          btnNext.attr("class", "cssBtnNext_Enabled");
           }
           else
           {//was enabled, now disable
              btnNext.attr("disabled", "disabled"); //disable button
              btnNext.attr("class", "cssBtnNext_Disabled");
           }
       }


}

</script>

Answer 2

我可以解决您的问题： $(".classButton").prop('disabled','disabled');

Answer 3

您在复选框的单击处理程序中缺少括号。那是错字吗？我可能会重写它以适应设置按钮可见性以检查全部和单击任何复选框时共享相同的代码。请注意，如果您使用@SLaks 建议，您可以简化网格和按钮的选择器。我在所有情况下都使用“endsWith”选择器来处理 ASP.NET 名称修改。

<script type="text/javascript">
    $(document).ready(function () {
        var $chkAll = $('input[id$="ChkAll"]');
        var $boxes = $('[id$="ProductGrid"] input:checkbox').not($chkAll);

        // update all checkboxes and submit button when check all is toggled
        $chkAll.click( function() {
           if ($chkAll.is(':checked')) {
              $boxes.attr('checked','checked');
           }
           else {
              $boxes.attr('checked','');
           }
           setButtonState();
        });

        // when any checkbox is clicked, update submit button state
        $boxes.click( function() {
           setButtonState();
        });

        // if any checkbox is checked, button is enabled, else disabled.
        function setButtonState()
        {
            var state = 'disabled';
            $boxes.each( function() {
               if ($(this).is(':checked')) {
                  state = '';
                  return false;
               }
            });
            $('[id$="BtnAddCart"]').attr('disabled',state);
        }

    });
</script>

Answer 4

默认情况下，ASP.Net 会生成自己的 ID。

为按钮设置 ClientIdMode="Static" 以强制它使用您的 ID。
或者，写<%= BtnAddCart.ClientID %>获取生成的ID。