Reputation: 169
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
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
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