user1056998
user1056998

Reputation: 169

remove hidden field values on click jquery

I have this code: http://jsfiddle.net/gk5pV/8/

It's function is to add a td value to the absentees list. When clicked again, it should remove the td value from the absentees list. I got it working, however, the

$("#collect").append("<input type='hidden' name='absent[]' value = '" + temp + "'/>" + currentCellText);

value doesn't get removed. Only the text gets removed but the hidden value, which posts the hidden data for submission to databaase won't get removed. Any ideas?

Upvotes: 0

Views: 1497

Answers (2)

Rafay
Rafay

Reputation: 31033

i haven't seen the code but from the look of it you need to use delegate

$(document).delegate("td","click",function(){

 //remove or do what eve here
});

or if the table is not dynamically added then you can delegate the event to it like

$("table").delegate("td","click",function(){
  //event handling code here

});

the reason is the handlers do not get themselves attached to the dynamically added elements

if you are using jquery 1.7+ use on method


Upvotes: 1

d_inevitable
d_inevitable

Reputation: 4451

It does not get remove because you are setting it's value to "undefined". The td does not have ID to start with. When adding you are loading the id into the value of your hidden input.

If you assign the ID properly to the td, you can do this:

$("#collect input[value=" + $(this).attr("id") + "]").remove();

Or you instead you should load the text into the value (aka your temp variable):

var temp = $(this).text();

Now you can find the input like this:

$("#collect input[value=" + $(this).attr("id") + "]").remove();

For the text part its best to add a common wrapper:

$("#collect").append("<label><input type='hidden' name='absent[]' value = '" + temp + "'/>" + currentCellText + "</label>");

Now you can remove all in one go:

$("#collect input[value=" + $(this).attr("id")/*or $(this).text()*/ + "]").parent("label").remove();

Upvotes: 2

Related Questions