Question

I’ve a form field with one input field.

As soon as the user completes typing i need to make an ajax call and validate input on serverside.

I tired keyup, focusout, keydown and mouseup events but doesn’t seem to work as expected. Could some one please suggest the best keyboard events to choose to resolve this. If the input is blank the error message should be shown as well.

Answer 1

The event you are probably looking for is the blur() event, which is called when the user
leaves an input field (by pressing tab, or clicking on the next input for example)

Example:

   $(document).ready(function(){
        $('input#myInput').blur(function(){
            myValidator($(this), $(this).val());
        });
    });

    function myValidator($element, value)
    {
        // Example regex to sucessfully match a value of at least 4 digits
        if (!value.match(/^[0-9]{4,}$/)
        {
            // In this case I'm adding an error class to the input,
            // but feel free to do anything you like
            $element.addClass('error');
        }
    }

EDIT:

Validating via AJAX is VERY bad practice, as one could easily stop the HTTP request or disable JavaScript entirely (and personally I try to avoid unnecessary http requests).

I recommend first checking client side (JavaScript/jQuery only), and when submitted double check server-side (with PHP/ASP).