CODEWITHSUNDEEP
jquery
anadin
anadin

Reputation: 27

Jquery keypress issues

Ive been going round and round with this so I am hoping someone can assist me.

I have two functions in my code. The first works fine. You can click on the displayed value enter the info into the input field that displays and press enter and it works. The second when you click the value it shows the input but when you press enter it hangs the page and then it refreshes. However the cookie is stored.

Any ideas why the first one is working correctly but the second is making the page hang and refresh?

$(document).ready(function() {

    $('#userTo').click(function() {         
        if($(this).children('[name=userTo]').length == 0) {         
            $(this).html('<input type="text" name="userTo" size="3" value="<?php echo (abs((int)        $_COOKIE['user_for']) ? abs((int) $_COOKIE['user_for']) : $ir['userid']); ?>" style="font-size: 12px;font-family: Tahoma;padding:0;margin:0;text-align: center;" />');
            $('[name=userTo]').focus();
        }
    });

    $('#userTo').keypress(function(e){
        if(e.which == 13){
            var username = $('[name=userTo]').val();
            $.ajax({
                type: "GET",
                url: "donate.php",
                cache: false,
                data: "username=" + username,
                success: function(data){
                    if(data == 'null') {
                        alert('That user dosen\'t exist.'); 

                        $('[name=userTo]').focus();
                    } else {
                        $.cookie("user_for", username);
                        $('#userTo').html(data);
                    }         
                }                
             });        
          } 
     });
});

and this is the second function.

$(document).ready(function() {

    $('#credits').click(function() {        
        if($(this).children('[name=credits]').length == 0) {

            $(this).html('<input type="text" name="credits" size="3" value="<?php echo (abs((int)   $_COOKIE['user_credits']) ? abs((int) $_COOKIE['user_credits']) : $ir['d_credits']); ?>" style="font-size: 12px;font-family: Tahoma;padding:0;margin:0;text-align: center;" />');           
            $('[name=credits]').focus();            
        }       
    });

    $('#credits').keypress(function(e){         
        if(e.which == 13){              
            var d_credits = $('[name=credits]').val();              
            $.ajax({                   
                type: "GET",                   
                url: "donate.php",                 
                cache: false,                  
                data: "d_credits=" + d_credits,                
                success: function(data){                     
                    if(data == 'null') {                    
                        alert('That user dosen\'t exist.');      
                        $('[name=credits]').focus();                               } else {                      
                        $.cookie("user_credits", d_credits);                                  $('#credits').html(data);              
                    }                 
                }            
            });     
         }      
    });
});

Upvotes: 0

Views: 456

Answers (1)

ithcy
ithcy

Reputation: 5589

There's a lot of cleanup you could do in your code, but the main thing is: If you don't want the page to refresh when you hit enter in a form, you need to prevent the browser's default keypress handler from firing when you hit enter. As it is right now, your handler function will run first and do your ajax GET, and then the default handler will run, which will (probably) submit the form.

$('#credits').keypress(function(e) {
    if(e.which == 10 || e.which ==  13) {
        // ... do stuff ...
        e.preventDefault();
    }
});

You should be doing this in both functions. I'm not sure why the first one doesn't refresh the page; I'm guessing you have a submit button in one form and not the other?

Upvotes: 1

Related Questions