Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New Coder
    Join Date
    Jul 2012
    Posts
    15
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Wait till user finish typing in input filed

    Hi,


    Am trying to get some data from DB , here am checking whether username is registered or not , if he register am getting some data related to that user and displaying on window .

    I want function to wait for untill user finish typing his username ,
    then run the function , Below is my code ,
    Code:
    $(function (){  
            var minlength = 2;                        
            $("#username").keyup(function () {
            var that = this,
            value = $(this).val();          
            if (value.length >= minlength ) {
                    $.ajax({                
                            type: "GET",
                            url: "Path_to_php",
                            data: {'username' : value},
                            dataType: "html",
                            success: function(data){
                                    if (value==$(that).val()) {
                                            $("#content").append("<p>" + data + "</p>");
                                    }
                                    else {
                                            alert ("Username Not Registered");
                                    }
                            }
                    });
                    }
            });
    });
    Here , when user start entering his name , that time only Function getting call for each char he entered

  • #2
    Regular Coder
    Join Date
    Mar 2008
    Location
    London
    Posts
    152
    Thanks
    4
    Thanked 42 Times in 42 Posts
    Its because you are invoking the "onKeyUp" event that the function call starts immediately.

    Well, "OnKeyUp" is the right event, but how your code will come to know that user has finished entering the text ?

    For that you need to track a specific key. If that key is hit, that means user has finished entering the text. Normally we call this specific key as the "Enter key".

    So, onkeyup, you track which key was pressed. If its "Enter key", then only you start processing your code.

    something like -
    Code:
    var key = event.which || event.keyCode;
    if(key == 13) { // 13 is the keycode for enter key
    // your piece of code here...
    }
    Hope it helps you out...

    Regards,
    Niral Soni

  • #3
    New Coder
    Join Date
    Jul 2012
    Posts
    15
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Hey ,

    Thank you for your time ,

    I didn't how to do that ............

    Please can you edit my code , Below is JSfiddle link

    http://jsfiddle.net/ZvNFc/

  • #4
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,605
    Thanks
    80
    Thanked 4,634 Times in 4,596 Posts
    An easier way: Just use "onchange" instead of "onkeyup".

    That is, when the browser detects the user has finished changing the field--when the user hits the TAB key or the ENTER key or mouse clicks to a different field *AND* the contents of the field have *changed*--*THEN* do your AJAX actions.

    SO just change
    Code:
            $("#username").keyup(function () {
    to
    Code:
            $("#username").change(function () {
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • Users who have thanked Old Pedant for this post:

    Pervez (01-13-2013)

  • #5
    New Coder
    Join Date
    Jul 2012
    Posts
    15
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Smile

    Thank You buddy


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •