BadHorsie
BadHorsie

Reputation: 14564

jQuery removes textarea placeholder when clearing textarea text

I have a Bootstrap modal with a textarea in it. When you open the modal, the textarea needs to be cleared of any previous text so it's fresh every time you open it.

The problem is, the placeholder on the field is also removed the first time you clear the text.

I am using $('textarea').val('') to clear the text.

http://jsfiddle.net/dkRS8/1/

Upvotes: 3

Views: 2765

Answers (4)

penacho123
penacho123

Reputation: 21

try

$(document).ready(function() {
    $('#modal').bind('hide',function(){
        $('textarea',this).val('')
    })
});

multi-browser, jquery-ui event standar

Upvotes: 0

Pandian
Pandian

Reputation: 9126

Among the IE versions.. IE 10 only support place holder.... So dont try this thig on older versions of IE....

but other browsers like firefox, Chrome, Opera ... all support this attribute...

try the below code it will help you...

Updated fiddle : http://jsfiddle.net/dkRS8/6/

$(document).ready(function() {

    $('#modal').on('show', function() {
        var ele = $(this).find('textarea');
        ele.val('');
    });

});

Upvotes: -1

Martin
Martin

Reputation: 61

It does work when you register to the "shown" event instead of the "show" event.

$(document).ready(function() {

    $('#modal').on('shown', function() {
        $(this).find('textarea').val('');
    });

});

Upvotes: 2

koopajah
koopajah

Reputation: 25602

You need to trigger the blur event for the placeholder to appear again. And it works only during the hide event, so that when it appears again the placeholder is put back.

$('#modal').on('hide', function() {
    $(this).find('textarea').val('').blur();
});

working jsfiddle

EDIT: I was wrong, it seems that it works without the blur by just changing the event from show to hide as explained by Martin in his answer where he uses the event shown

Upvotes: 2

Related Questions