添加客户端更改事件后，ASP.NET 文本框未回发答案

【问题标题】：ASP.NET Textbox not posting back after adding a client side change event添加客户端更改事件后，ASP.NET 文本框未回发
【发布时间】：2013-10-23 17:17:25
【问题描述】：

我的 Web 窗体上有一个 ASP.NET 文本框，我正在使用以下代码将其制成 jQuery DatePicker：

$('#<%= txtServiceDateRequested.ClientID %>').datepicker();

那部分工作正常。我还将AutoPostBack 属性设置为True，这样无论何时选择日期，页面都会发回。这也很好用。我遇到的问题是我试图在页面回发时禁用我的其他控件。我正在使用此代码：

    $(function() {
        $('#<%= txtServiceDateRequested.ClientID %>').change(function () {
            $('#<%= ddlTimeRequested.ClientID %>').prop('disabled', true);
            $('#<%= ddlServiceType.ClientID %>').prop('disabled', true);
            $('#<%= ddlService.ClientID %>').prop('disabled', true);
            $('#<%= ddlGenderRequested.ClientID %>').prop('disabled', true);
            $('#<%= txtServiceDateRequested.ClientID %>').attr('disabled', true);
        });
    });

所以我绑定到我的文本框（日期选择器）的change 事件。当我添加这段代码时，它确实会像它应该的那样禁用我的控件，并且它似乎会进行回发，但是当我在后面的 C# 代码上放置一个断点时：

protected void txtServiceDateRequested_TextChanged(object sender, EventArgs e)
{
    FixItems(); // I'm putting a breakpoint here
}

由于某种原因，断点永远不会被命中。如果我注释掉上面绑定change 事件并禁用控件的javascript 代码，那么断点会按预期命中。有人能告诉我为什么当我取消注释并启用上面的 JS 代码时我的断点没有命中吗？

编辑：

在玩了一些之后，问题似乎是文本框本身被禁用时。根据我的推测，我点击了文本框，我的 jquery 日历出现了。然后我选择一个日期。然后似乎我的禁用代码正在执行，然后 jquery 试图将我选择的日期插入到文本框中。但由于文本框被禁用，它并没有将新日期放在那里。所以也许我需要一种方法让 jquery 日历代码在我的禁用代码被触发之前先执行？

【问题讨论】：

标签： c# jquery asp.net

【解决方案1】：

您只需为文本框添加AutoPostBack="true"。我用下面的代码测试过：

<html xmlns="http://www.w3.org/1999/xhtml">

 <script type="text/javascript">
     $(function () {
         $(".datepicker").datepicker({
             onSelect: function () {
                 this.fireEvent && this.fireEvent('onchange') || $(this).change();
             }
         });
     });
</script>
</head>
<body>

<form id="form1" runat="server">
<div>
    <asp:TextBox ID="TextBox1" runat="server" CssClass="datepicker"                   
     OnTextChanged="TextBox1_TextChanged" AutoPostBack="true"></asp:TextBox>
</div>
</form>
</body>
</html>

【讨论】：

【解决方案2】：

change 方法是覆盖来自 ASP.NET 的默认事件__doPostBack，那么它永远不会调用服务器。

您应该改用 Bind，将另一个函数附加到 change 方法：

$('#<%= txtServiceDateRequested.ClientID %>').bind( "change", function( event ) {
  // do stuff
});

【讨论】：

我将其更改为bind，但它似乎仍然没有达到我的断点。我也试过on。还是没有运气。
只是好奇，这个js块在哪里？你应该把这个放在身体后面！我在这里尝试过并且有效，也许我们错过了其他东西。尝试检查 evets 是否绑定到您的元素，并检查 Firebug 或 Chrome 控制台中的任何 JS 错误
它使用母版页。我在结束 </asp:Content> 标记之前有脚本标记。在母版页内，<asp:Content> 标记位于 <form> 标记之间。所以它会呈现类似于这样：<html><body><form> My HTML Code...My JS Code</form></body></html>
我正在使用 Chrome，我正在查看控制台，但没有看到任何 javascript 错误。控制台屏幕为空白。
Fals -- 如果有帮助，我可以将我的整个代码发布到文件中，如果你愿意的话。它没有那么大。

【解决方案3】：

不要在更改事件触发时禁用控件，而是将其添加到onClose 或onSelect。所以你的代码可能看起来像

    $("#<%= txtServiceDateRequested.ClientID %>").datepicker({
       onClose: function( selectedDate ) {
                     $('#<%= ddlTimeRequested.ClientID %>').prop('disabled', true);
                     $('#<%= ddlServiceType.ClientID %>').prop('disabled', true);
                     $('#<%= ddlService.ClientID %>').prop('disabled', true);
                     $('#<%= ddlGenderRequested.ClientID %>').prop('disabled', true);
                     $('#<%= txtServiceDateRequested.ClientID %>').attr('disabled', true);
        }
    });

【讨论】：