This is a continuation from the previous stackoverflow jQuery question I asked, but I don't think the line that says:
$(".insert").live("click", insertHandler);
is working.
<!DOCTYPE HTML>
<html>
<head>
<script src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
function insertHandler(currentRow) {
var newRow = currentRow.clone(true);
newRow.children('td:last').empty().append('<input name="myid" />');
currentRow.after(newRow);
document.myForm.myid.focus();
}
function OnLoad() {
$('input[name="myid"]').live('focusout', function() {
var myValue = $(this).val();
var currentCell = $(this).parents("td");
currentCell.empty().append(myValue);
$(".insert").live("click", insertHandler); // I need help here
});
$('.insert').live('click', function() {
$('.insert').die();
var currentRow = $(this).parents("tr:first");
insertHandler(currentRow);
});
$('.delete').live('click', function() {
if (confirm("Are you sure?")) {
$(this).parents("tr").remove();
}
});
}
google.load("jquery", "1");
google.setOnLoadCallback(OnLoad);
</script>
</head>
<body>
<form name="myForm">
<table border="1">
<tr>
<td class="insert">Add</td>
<td class="delete">Erase</td>
<td>Sample data goes here</td>
</tr>
</table>
<input name="Other">
</form>
</body>
</html>
I want the user to be able to add a new row, but not click "Add" over and over again continually.
With your help, I've disabled the "Add" event, but now I'm having trouble getting back enabled.