Hi Guys,
I've got a simple form with checkboxes. When someone checks the 'Other'
checkbox, a new checkbox is appended to the end of the list, so the user
can add as many "Other' fields as they like (code is below). I've
created a function that binds the click function to the class of the
'Other' checkboxes. After it has appened the new checkbox it then has to
call itself to rebind the click function to the new checkbox. This is
working great in FF, but in IE6 and IE7 I get an infinite loop and it
keeps adding checkboxes until I stop the script. Can anyone please
point out my mistake here?
<html>
<head>
<title>Test</title>
<script src="http://www.sitesuite.com.au/affiliate/js/jquery/jquery.js"
type="text/javascript"></script>
<script>
var othercnt = 1;
function initOther() {
$(".otherfield").unbind("click").click(function() {
if ($(this)[0].checked == true) {
othercnt++;
$(this).parent().parent().append('<div id="other_' + othercnt +
'"><input type=checkbox name=other class="otherfield"> Other: <input
type=text name="validation_level" value="" class="input othertext"></div>');
}
else
{
$(this).next(".othertext").val('');
var lastcount = othercnt;
var lastdiv = "#other_" + lastcount;
var lastfield = lastdiv + " .otherfield";
if ($(lastfield).checked != true) {
$(lastdiv).remove();
othercnt--;
}
}
initOther(); // re-initialise click function on new checkbox - THIS
IS THE PROBLEM
});
}
$(function(){
initOther();
});
</script>
</head>
<body>
<table>
<thead>
<tr><th>Validation Levels</th></tr>
</thead>
<tbody>
<tr>
<td >
<table width=100% cellpadding=0 cellspacing=0 border=0>
<tbody>
<tr>
<td>
<div><input type=checkbox
name=validation_level value="Basic">Basic</div>
<div><input type=checkbox
name=validation_level value="Standard">Standard</div>
<div><input type=checkbox name=other
class="otherfield"> Other: <input type=text name="validation_level"
value="" class="input othertext"></div>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</body>
Regards,
David
_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/