1.Download Ext2 from extjs.com or openext.sf.net,basically we need 3 files(and directories) from the pack:
File ./adaptor/ext/ext-base.js
File ./ext-all.js
Directory ./resources
In the head area of you html page,include the ExtJS libraries and stylesheets:
<link rel="stylesheet" type="text/css" href="../lib/resources/css/ext-all.css" />
<script type="text/javascript" src="../lib/ext-base.js"></script>
<script type="text/javascript" src="../lib/ext-all-debug.js"></script>
2.Download the latest release of ExtXL,and we only need ./dist/ExtXL.js.
Include ExtXL lib below the Ext libs:
<script type="text/javascript" src="../dist/ExtXL.js"></script>
3.Write ExtXL widgets.For example,we have a panel with title "Register":
<span ext:xtype="panel" ext:title="Register">
<xml xmlns="http://extxl.sourceforge.net">
<content>HTML content</content>
</xml>
</span>
4.Manually initialize ExtXL widgets in the end of page:
<script type="text/javascript">
Ext.onReady(function(){
ExtXL.markAll();
});
</script>
Below is the result:
