Gowri
Gowri

Reputation: 16835

clear text field value in clone object

I am having trouble to clear text field value created from jQuery clone function. I am just copying add_new_content content and appending that one with last add_new_content element.it works good.But in case, clicking add_new_box after enter some text in the text fields means. it clones with input value.but i want fresh text field.

Mark up

<div class="add_new_content">
<div class="add_new_box">ADD NEW</div>
<input type="text" value="" />
</div>   

Script

$(document).ready(function(){

 $(".add_new_box").live('click',function(){

 $('.add_new_content:last').clone().appendTo('.add_new_content:last');

});

});

Working Example is Here

How can i do that.

Upvotes: 27

Views: 42514

Answers (3)

marcnewport
marcnewport

Reputation: 91

remove the value after you clone it eg.

var $clone = $('.add_new_content:last').clone();
$clone.find('input').val('');
$clone.appendTo('.add_new_content:last');

Upvotes: 0

DefyGravity
DefyGravity

Reputation: 6011

set the value right before, or after, you clone it.

$(document).ready(function(){

 $(".add_new_box").live('click',function(){

 var clone = $('.add_new_content:last').clone();
 clone.find("input").val("");
 clone.appendTo('.add_new_content:last');

});

});

Upvotes: 10

Fr&#233;d&#233;ric Hamidi
Fr&#233;d&#233;ric Hamidi

Reputation: 262939

You can match the cloned <input> element with find() and reset its value with val():

$('.add_new_content:last').clone()
                          .find("input:text").val("").end()
                          .appendTo('.add_new_content:last');

Upvotes: 86

Related Questions