CODEWITHSUNDEEP
javascriptjquery
H.HISTORY
H.HISTORY

Reputation: 518

jQuery: Append element to inputfield and remove?

I'm trying to append and remove element in the inputfield.

I can simply append them and it works fine but I don't know hwy it doesn't get deleted/removed when I needed it to!

To explain this issue I have created this fiddle: http://jsfiddle.net/hrL3gn1g/2/

if you click on the images, it will append the element in the div Slevel as well as the inputfield.

If you click on the elements inside the Div, it should delete/remove the element or string from inside the inputfield but it doesn't

could someone please advise on this issue?

Upvotes: 0

Views: 41

Answers (2)

Theo Itzaris
Theo Itzaris

Reputation: 4671

as i see , you try to remove the words(orange,apple etc) by using $(<input>).remove(<span>), but you cant do this in that way.instead of this , i remove the selected <span> element.

i changed a little the click listener function to this one:

//when the user click on a word
$(document).on('click', '.pricetag',function(){   
    //this is the <span> element that the user clicked to delete
    $(this).remove();   
});

i changed the jsfiddle : http://jsfiddle.net/tornado1979/hrL3gn1g/3/ hope helps,good luck.

Upvotes: 0

furcicm
furcicm

Reputation: 105

You can try this:

$(document).on('click', '.pricetag',function(){

   var names = $(this).attr('data-name');
   var price = $(this).attr('data-price');

   // Create the value you want to remove
   var html = '<span data-price="'+price+'" data-name="'+names+'" class="pricetag">'+names+'</span>';

   // Replace that value with empty string
   var newValue = $('#Finalized').val().replace(html,'')

   // Insert new value
   $("#Finalized").val(newValue);

});

Upvotes: 1

Related Questions