Monday, July 28, 2014

using JQuery to detect the textbox change from the client side in ASP.Net web application

for javascript we can handle the textbox change event with onChange attribute from control

but the onChange only fire when the control lost the focus. so you might even need to implement the
OnKeyUp event if you want to handle the content change in the textbox.


However JQuery will simplify the process by bundling those events together(onChange, OnKeyUp, OnKeyDown).

the following is an example to handle auto tab when the length of content had reached the max length in the text box. the text box control will lost it focus and cursor will move to the next control in the tab order.


if($(".MyControlCSS") !=null){
                $(".MyControlCSS").on("input",function(e){
                   //put your logic here to manipulate the content change
                    SetAutoTab("MyControlCSS","NextControlCSS",3)   
                })
            }

function SetAutoTab(MyControlCSS,NextControlCSS, maxLength){
    var myControl=$('.' +MyControlCSS);
    if(myControl !=null){
         if(myControl .val().length==maxLength){
            $('.'+NextControlCSS).focus();
        }
    }
}


No comments:

Post a Comment