Embed Dynamic XUL document into HTML Page
No more server side tweak..., I guess :-P.
You need Firefox 1.5+ to see how it works
debug message...
see full Javascript source
<![CDATA[
<script type="text/javascript; e4x=1">
//http://developer.mozilla.org/en/docs/New_in_JavaScript_1.6
//JavaScript 1.6 is supported in Firefox 1.5 and later.
function initXUL(){
if( !document.getBoxObjectFor || !window.openDialog) return alert('xul is not supported');
var xul= <window title="XUL Lists"
xmlns:html="http://www.w3.org/1999/xhtml"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<toolbox flex="1">
<menubar id="sample-menubar">
<menu id="file-menu" label="[ This is an XUL Menu ]">
<menupopup id="file-popup">
<menu id="new-menu" label="New">
<menupopup id="new-popup">
<menuitem label="Window"/>
<menuitem label="Window Foo "/>
<menuitem label="Message"/>
</menupopup>
</menu>
<menuitem label="Open"/>
<menuitem label="Save"/>
<menuseparator/>
<menuitem label="Exit"/>
</menupopup>
</menu>
</menubar>
</toolbox>
<vbox flex="1" style="overflow: auto">
<groupbox>
<caption label="with multiple columns and a scrollbar" />
<listbox rows="8">
<listcols>
<listcol flex="1" />
<splitter class="tree-splitter" />
<listcol flex="1" />
<splitter class="tree-splitter" />
<listcol flex="1" />
</listcols>
<listhead>
<listheader label="Name" />
<listheader label="Date" />
<listheader label="Number" />
</listhead>
<cell>data</cell>
</listbox>
</groupbox>
</vbox>
</window>
//add data rows
var n = 0;
var dataXML = [];
while(n < 20 ){
n++;
dataXML.push(
[ '<listitem onclick="parent.debug(event)" rowIndex="', n ,'" >',
'<label value=" item ', n,'" />',
'<label value="', new Date() ,'" />',
'<label value="', Math.random() ,'" />',
'</listitem>'
].join('')
);
};
xul = xul.toString().replace( '<cell>data</cell>' , dataXML.join('') )
xul = [ '<' , '?xml version="1.0"?>' , '<' , '?xml-stylesheet href="chrome://global/skin/" type="text/css"?', '>' , xul ].join('');
var src = 'data:application/vnd.mozilla.xul+xml,'+ encodeURIComponent(xul);
var dFrame = document.getElementById('xul-grid');
dFrame.src = src ;
};
window.onload = initXUL;
</script>
]]>
See also ActiveX Listview for Internet Explorer