admin管理员组

文章数量:1241083

I have a textbox asp server control. I am modifying the value of textbox from javascript i want to detect when the textbox text is changed. I tried onchange event which gets called on lost foucs when the text changes. But in my case i an changing text from Javascript. how can i achieve this?

I have a textbox asp server control. I am modifying the value of textbox from javascript i want to detect when the textbox text is changed. I tried onchange event which gets called on lost foucs when the text changes. But in my case i an changing text from Javascript. how can i achieve this?

Share Improve this question asked Apr 26, 2011 at 6:30 Ulhas TuscanoUlhas Tuscano 5,62015 gold badges59 silver badges90 bronze badges
Add a ment  | 

4 Answers 4

Reset to default 6

Updating the value property won't trigger the change event. The change event is triggered by the user.

You can either write a function which changes the value and does whatever else you need to do...

function changeTextarea(str) {
   document.getElementById('a').value = str;
   // Whatever else you need to do.
}

...or poll the textarea's value...

(function() {
   var text = getText();   
   var getText = function() {
      return document.getElementById('a').value;
   }  

   setInterval(function() {
      var newtext = getText();
      if (text !== newText) {
          // The value has changed.
      }
      text = newText; 
   }, 100);
})();

...or explicitly call the onchange() event yourself.

document.getElementById('a').onchange();

(Assuming you set the event up with onchange property.)

The workarounds are not terribly great solutions. Either way, you need to do some intervention to trigger extra code when updating a textarea's value property.

Using Jquery you can assign a 'change' handler and invoke the handler like this:

<html xmlns="http://www.w3/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            //makes 'DetectChange' the handler when TextBox1 changes...
            $('#TextBox1').change(function () {
                DetectChange();
            });
         });

        function DetectChange() {
            alert("TextBox1 has been changed");
        }

        function ClickTheButton() {
            // .val actually 'changes the value'
            // while you have to add .change() to invoke the actual change event handler...
            $('#TextBox1').val("Changed When Button Clicked").change();

            //return false prevents the click event of the button from doing a post back
            //keeping everything on the client for this sample..
            return false;
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
        <input id="Button1" type="button" value="Change TextBox1" onclick="return ClickTheButton();"  />
    </div>
    </form>
</body>
</html>

You could force a postback from javascript and hence forcing a page reload event. In the Page.GetPostBackEventReference() you can handle the event and perhaps fire some other event.

This is not a good solution thougth and I truly remend that you do it all thru javascript or drop the javascript and let .NET hadle everything, perhaps with Ajax.NET

The following link explains hwo you do it for a normal button, but it shouldn't be to hard to make it for a onchange event.

If you could use jQuery, it would be something like this

$('#id_of_text_area').change(function(){
    //do something
});

本文标签: aspnetHow to detect textbox change event from javascriptStack Overflow