[Dojo-interest] Solution to rendering Dojo widgets after AJAX calls

[Williams, Matthew (Melbourne/Software)]

I know myself and some others have had some difficulty with getting
content imported from an AJAX call to render correctly.

Someone over at http://www.ajaxprogrammer.com came up with a pretty
clever hack to accomplish this.

Demo -
http://www.ajaxprogrammer.com/examples/post_17/mih_dojo_widget/page1.php
Source -
http://www.ajaxprogrammer.com/examples/post_17/mih_dojo_widget/mih_dojo_
widget.zip

Excellent screencast on the "missing image hack":
http://www.ajaxprogrammer.com/?p=17

Here is the hack, placed within the page you're making the AJAX call to
using evalScripts being true.  This will then parse any Dojo widgets
contained on the page:

<!--- MISSING IMAGE HACK --->
<img src="404.gif" style="position:absolute;width:0px;height:0px"
onerror="(function(){

	function makeWidget(){
		dojo.require('dojo.widget.TabContainer');
		dojo.require('dojo.widget.LinkPane');
		dojo.require('dojo.widget.ContentPane');
		dojo.require('dojo.widget.LayoutContainer');

		// THIS CODE IS FROM THE dojo.hostenv.makeWidgets
FUNCTION IN dojo.js (~ LINE 1480 IN THE AJAX EDITION)
		var parser = new dojo.xml.Parse();
		var frag  =
parser.parseElement(document.getElementById('myContainer'), null, true);
		dojo.widget.getParser().createComponents(frag);

		// AFTER EVERYTHING IS READY, MAKE THE CONTAINER VISIBLE
		document.getElementById('myContainer').style.visibility
= 'visible';
	}
	var interval = setInterval(function(){
		if(document.getElementById('myContainer')){
			clearInterval(interval);
			makeWidget();
		}
	}, 10);

})()" />

Matthew D. Williams
Engineering Tools Group, Northrop Grumman IS Eastern Region
(321) 951-5489
Matthew.d.Williams at ngc.com
M/S T01-222

-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://dojotoolkit.org/pipermail/dojo-interest/attachments/20070213/22c4f311/attachment.html