[jquery] How to fire the same function when user presses enter or makes a click

Question

Hello,

I have my own edit in place function for jquery which looks like this

    $('.editRow').live('click', function() {
 var row = $(this).parent('td').parent('tr');
 row.find('.1u').slideUp('fast');
 row.find('.1p').slideUp('fast');
 row.find('.inputTxt').slideDown('fast');
 $(this).parent('td').empty().append('<a href=# class=cancel>Cancel</a> / <a href=# class=save>Save</a>');
});

$('.cancel').live('click', function () {
 var row = $(this).parent('td').parent('tr');
 row.find('.1u').slideDown('fast');
 row.find('.1p').slideDown('fast');
 row.find('.inputTxt').slideUp('fast');
 $(this).parent('td').empty().append('<a href=# class=editRow>Edit</a>');
});

$('.save').live('click', function () {
 var thisParam = $(this);
 var row = $(this).parent('td').parent('tr');
 var id = row.attr('id');
 var userid = row.find('#1ui').val();
 var pass = row.find('#1pi').val();

 $.ajax({
 type: 'post',
 url: 'filefetch_update.php',
 data: 'action=updateUser&pass=' + pass + '&id=' + id + '&userid=' + userid,

 success: function(response) {
  $('#response').fadeOut('500').empty().fadeIn('500').append(response);
  var row = thisParam.parent('td').parent('tr');
  row.find('.1u').text(userid).slideDown('fast');
  row.find('.1p').text(pass).slideDown('fast');
  row.find('.inputTxt').slideUp('fast');
  thisParam.parent('td').empty().append('<a href=# class=editRow>Edit</a>');
 }
 });
});

Now i want to run the save function when the user clicks Save and also when enter is pressed on keyboard.

Answer 1

Not sure but this might work

<input type="text" onkeypress="return runScript(event)" />
 function runScript(e) {
    if (e.keyCode == 13) {
     // do some thing like
            $('.save').click();
      }
}

Answer 2

Essentially, all you need to do is the same as you're already doing, but bind the 'keypress' event to the text field and check e.which in the handler function. If it's key 13 (I think), then go ahead and do the same code as you're doing for 'click'.

$('.your-text-field').live('keypress', func)

where func checks the key and executes the saving code. It would be a good idea to break the click handler out into a separate function, so that the keypress handler can call it without having to duplicate the source.

Have a look here, should help: jQuery keypress event

Answer 3

This should work for you:

$(document).keypress(function(e) {
    if (e.which == 13) {
     $('.save').click();
    }
)};