I have a Dojo tab-container and when I click on certain buttons, a new tab is added dynamically with its contents downloaded via Ajax. The tabs contain dynamic form elements which are parsed and loaded by Dojo just fine. I am also including Javascript blocks which are specific for each tab and those are downloaded as well via Ajax... however, none of the Javascript blocks execute!
Example of tab content:
<input id="test" name="test" type="text" dojoType="dijit.form.ValidationTextBox" />
<script type="text/javascript">
dojo.connect(dijit.byId('test'), 'onClick', function(evt){
alert('testing 123');
});
</script>
However, if I do this instead the events trigger just fine:
<input id="test" name="test" type="text" dojoType="dijit.form.ValidationTextBox">
<script type="dojo/method" event='onClick'>
alert('testing 123');
</script>
</input>
My question is, why don't Javascript blocks in the first example work? is this a Dojo limitation? Also, I am also trying to set properties and values for the widgets AFTER they've been loaded. How do i active that given I have to use something like dojo.addOnLoad() which won't work because it requires a Javascript block and that doesn't work as per the first example... There is no equivalent widget onLoad event so I can't use the second method either... Any ideas how to go about doing this?
The "tab content" is actually a Content Pane element. You can't call a javascript inside a content pane unless you use <script type="dojo/method">. At least this is what I know.
Update: ifyou'll use dojox.layout.ContentPane instead of the dijit.layout.ContentPane all the problems regarding the js inside it will vanish. From Dojo Reference Guide:
dojox.layout.ContenPane is an extension to dijit.layout.ContentPane providing script execution, among other things.