object not found error with dynamic web forms with (jquery) javscript script
- by deostroll
In a normal aspx page I've set up a jquery tab system. When a particular tab shows up I wire up an ajax call to get another html page with the following content. It is simply a form with some javascript inside of it.
<!-- demo.htm -->
<form method="post" action="post.aspx">
<div id="fields">
Class: <input id="txtclass" name="txtclass" type="text"/>
Grade: <input id="txtgrade" name="txtgrade" type="text"/>
<input id="btnupdate" value="Update"/>
</div>
<div id="update">
Reason:<br/>
<input id="txtreason" name="txtreason" type="text"/>
<br/>
Comments:<br/>
<textarea id="txtcomments" name="txtcomments"></textarea>
<br/>
<input type="button" id="btnsave" value="Save"/>
</div>
<script type="text/javascript">
$(function(){
//all textboxes should be disabled
$('#fields input').each(function(i,j){
if(! $(this).is(':button') )
$(this).attr('disabled', 'disabled')
});
//update div should be hidden
$('#update).hide();
//click event of btnupdate should
// be set to show the update div contents
// and enable input fields
$('#btnupdate').click(function(){
//enable all textboxes
$('#fields input').each(function(i,j){
$(this).attr('disabled', '');
});
//hide btnupdate
$('#btnupdate').hide();
//show div update
$('#update').show();
});
});
</script>
</form>
The script executes normally and the form is shown as intended. The btnupdate is supposed to show the contents in the update div and load the form for accepting user input. Whenever I hit btnupdate button I get an object not found exception on IE 8. IE 8 asks if it should start up its in-built debuggger. But, even in this debugger I cannot see what the problem is...However on clicking "No" in that dialog the button click function executes properly, and the form is displayed as intended. Is there a better way to resolve the problem?
