使用TextBox进行用户文本输入处理

Question

我有这个控制权：

我正在尝试创建一种验证，每当用户向TextBox输入文本时，“添加”按钮将被启用，当文本为“”（null）时，“添加”按钮是禁用。 我不想使用验证器。

这是代码：

protected void addNewCategoryTB_TextChanged(object sender, EventArgs e)
    {
        if (addNewCategoryTB.Text != "")
            addNewCategoryBtn.Enabled = true;
        else
            addNewCategoryBtn.Enabled = false;
    }

问题是，当用户输入文字时，“添加”按钮不会从禁用变为启用（反之亦然）......

任何想法？

Answer 1

是Web表单吗？在Web窗体中，默认情况下不会触发TextBox的TextChanged事件。 要触发事件，您必须将TextBox的AutoPostBack属性设置为true。

但是，这会执行一个HTTP帖子，什么是丑陋的纠结，或者你可以将其包装在UpdatePanel

一个更优雅的选择，就是使用jQuery来做，在jQuery中这样做，你需要一些代码，如：

$(document).ready(function() {
    $("#<%= yourTextBox.ClientID %>").change(function() {
        var yourButton = $("#<%= yourButton.ClientID %>")

        yourButton.attr('disabled','disabled');
        yourButton.keyup(function() {
            if($(this).val() != '') {
                yourButton.removeAttr('disabled');
            }
        });

    });
});

Answer 2

您需要使用Javascript完成此操作，因为ASP.NET无法执行此类客户端修改。想一想......每次在文本框中按下一个字母时，都必须回发并刷新页面，以确定文本框是否为空。这是ASP.NET与Winforms / WPF不同的一种方式。

Answer 3

TextChanged事件每次都会在服务器上进行回发。您无需为此类任务增加这些请求。

您可以使用jquery来实现此目的

var myButton = $("#btnSubmit");
var myInput=$("#name");
myButton.prop("disabled", "disabled");

myInput.change(function () {
  if(myInput.val().length > 0) {
    myButton.prop("disabled", "");
  } else {
    myButton.prop("disabled", "disabled");
  }
});

JS Fiddle Demo

使用服务器控件时，您只需要处理元素ID。为此，您可以使用ClientID或设置属性ClientIdMode="Static"