vanamerongen
vanamerongen

Reputation: 837

Append text to form input element value on focusout()

I'd like to append a 'saved' text to a value in an input form element when it goes out of focus. I've tried the following, but it doesn't seem to work.

My element:

<div class="info small">
   <span class="element">
        <label for="email">Email</label><br />
        <input type="text" id="email" value="" />
   </span>
</div>

My jQuery:

$('div.info').on('keyup', 'input', function(event){
    $id = $(this).parent().parent().attr('id');
    $id = parseInt($id);
    $field = $(this).attr('id');
    $text = $(this).val();
    updateField($id, $field, $text);
});

$('div.info').on('focusout', 'input', function(event){
    $('input').append(' saved.');
});

Upvotes: 3

Views: 4679

Answers (2)

George
George

Reputation: 36794

From what I can gather, you'd like the input to have the given value plus ' saved.':

$('div.info').on('focusout', 'input', function(event){
    $(this).val(this.value + " saved.");
});

Of course it will append it multiple times, if you focus out of the input multiple times, but I'll leave that issue for you to have a go at.

JSFiddle

Upvotes: 4

tymeJV
tymeJV

Reputation: 104795

Use .blur() and set the val of the input:

$('div.info').on('blur', 'input', function(event){
    var currentVal = this.value;
    $('.input').val(currentVal + ' saved.');
});

Upvotes: 3

Related Questions