ASP.NET: Async postback as I type in a text box

Question

I have a TextBox control on a page that I want to use to filter a grid. I would like the TextBox control to asynchronously post back to the page as the user types in values into the text box; preferably at a certain interval (i.e. it waits 500 ms after the user stops typing before posting back.)

How can I accomplish this in ASP.net? I know that the UpdatePanel and TextBox TextChanged event doesn't give me what I need because it does not fire as the user is typing, only after the control loses focus or if the page is posted some other way.

I also don't want an autocomplete type functionality. Are there any controls that will allow me to do what I want?

Answer 1

I suppose the OnKeyUp Javascript function would best suit your needs.

Depending on what you are doing, though, this could get very costly in terms of performance...

Answer 2

You can use jQUery, fire it on keyUp() event, and set setTimeOut method before firing an ajax call.

  $("#id input").keyup(function(){
        var $value = $(this);

         if (this.value != this.lastValue) {  
            if (this.timer) clearTimeout(this.timer);
            msgbox.css({"background-image":"none"}).html('<img src="img/ajax-loader.gif" height="16" width="16" /> checking availability...');

           this.timer = setTimeout(function () {       
                     $.ajax({

                      type: "POST",

                        url: "Default.aspx/StaticMethod",

                data: "{'username': '" + $value .val() + "'}",

                contentType: "application/json",

                dataType: "json",

                success: function(msg) {    

                    if (msg.d != 1) {

                        //
                    }
                    else {
                       //

                    }
                }
            });

             }, 200);

             this.lastValue = this.value;

            }//
        }


     });