Imesh Chandrasiri
Imesh Chandrasiri

Reputation: 5679

fire jquery focus out when only the input focus is changed

I use the following code to add the selected div value into a input.

    var lastFocus;
    $('.num-button').click(function(e){
        e.preventDefault();
        e.stopPropagation();
        //addOrRemoveWatermark(lastFocus);
        $(lastFocus).val($(lastFocus).val() + $(this).children('span').html());
    });
    $('.del').click(function(e){
        e.preventDefault();
        e.stopPropagation();
        //addOrRemoveWatermark(lastFocus);
        $(lastFocus).val(function(index, text){
            return text.replace(/(\s+)?.$/, '');
        });
    })

below is a sample image if the input panel I have! This is developed for a touch device and hence the key pad.

enter image description here

The script works fine to add value on each button press in the keypad. The problem I'm facing is for the room number I want to run an ajax call after the user has entered the amount. But since the focus is removed every button click, how can I run the script when the focus is changed to another input. I tried the jquery .focusout() method but it gets fired each and every time the user clicks on a number button.

if anyone can suggest me a work around that would be a great help! thank you!

Upvotes: 1

Views: 774

Answers (1)

David Hedlund
David Hedlund

Reputation: 129792

Perhaps you could delay the request with something like the following:

var roomNoChanged = false;
$('#room-number').change(function() {
    roomNoChanged = true;
});

$('#table-number, #no-of-guests').focus(function() {
    if(roomNoChanged) {
        roomNoChanged = false;
        $.post(...)
    }
});

Upvotes: 1

Related Questions