CODEWITHSUNDEEP
javascriptjquery
Shishant
Shishant

Reputation: 9294

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

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.

Upvotes: 1

Views: 241

Answers (4)

Tarun Allawadhi
Tarun Allawadhi

Reputation: 1

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

This is not working properly because after triggering a click on the 'go' element it returns back to the same function and hides the results so I modified this code when it returns back then returns false so output will not hide now.

Modified code is:

$(document).keypress(function(e) {
    if (e.which == 13) {
        $('#go').focus();
        $('#go').click();
        return false;
    }
});

Upvotes: 0

Mark
Mark

Reputation: 6254

This should work for you:

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

Upvotes: 1

Matt Sach
Matt Sach

Reputation: 1170

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

Upvotes: 0

Posto
Posto

Reputation: 7550

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();
      }
}

Upvotes: 0

Related Questions