Bind the Events to the Dynamically Created Rows in a HTML Table
I found a solution to bind the events to the dynamically created buttons in a HTML.Some times we need to add a row to the existing HTML table with some inputs.That dynamically created row is not visible in the page source.Try It !
So to attach the events also we need to do like this
So to attach the events also we need to do like this
var newRow = "<tr> <td></td> <td><input type='text'
id='tbNameDyn'/></td> <td> <input type='text' id='tbAgeDyn'/><
/td> <td><input type='checkbox'
id='tbResultDyn'/></td>
<td><input type='submit' name='submitButton' value='Save Row' id='btnSaveRowDyn' onclick='DynButtonClick();'> </td></tr>"; // $('#webgrid > tbody:last'). $('#webgrid tbody:last').append(newRow);Here I have binded the button with the event "onClick" function "DynButtonClick".See the Code too
function DynButtonClick() {
var rows = $('#webgrid tr').length;
var name = $('#tbNameDyn').val();
var age = $('#tbAgeDyn').val();
var checked = $('#tbResultDyn').val() == "on" ? true : false;
$('#hdnFldRowDyn').val(name + ":" + age + ":" + checked);
}
Now when we click on the dynamically created button the event associated to the button click will fire. Try this let me know if you have Queries :-)
Comments
Post a Comment