Dojo and Ajax - rendering widgets
- by Michael Merchant
I'm trying to load content into a Dojo content pane in a specific html tag and not replace the entire content pane. The html I'm loading includes a markup defined widget that I'd like to have rendered when the new row is loaded.
So, I have a table that is being dynamically filled via ajax,ie:
<body>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/dojo/1.5/dojo/dojo.xd.js"
djConfig="parseOnLoad: true, isDebug:true"></script>
<div id="table-pane" dojoType="dijit.layout.ContentPane">
<table class="test">
<tbody>
<tr><td>Name</td><td>Year</td><td>Age</td></tr>
<tr>
<td><span dojoType="dijit.InlineEditBox" editor="dijit.form.Textarea">Mike</span>
</td>
<td>2010</td>
<td>12</td>
</tr>
</tbody>
</table>
</div>
</body>
<script>
var html ='<tr><td><span dojoType="dijit.InlineEditBox" editor="dijit.form.Textarea">John</span></td><td>2011</td><td>22</td></tr>';
dojo.require("dijit.layout.ContentPane");
dojo.require("dijit.InlineEditBox");
dojo.require("dijit.form.Textarea");
dojo.addOnLoad(function(){
pane = dijit.byId("table-pane");
add_elem();
});
function add_elem(){
var node = $(".test tr:last");
node.after(html);
dojo.addOnLoad(function(){
//Here I want to initiate any widgets that haven't been initiated
pane.buildRendering();
});
}</script>
How do I render the Dojo widget in the new table row?