DHTMLX组件是一个JavaScript 库，提供了一套完整的Ajax驱动的UI 组件。
使用 dhtmlxSuite 生成企业级 web 应用程序有干净的界面、 快速的性能和丰富的用户体验。
组件
|
数据展现
|
|
|
导航
|
Menu、Toolbar
|
|
布局
|
Layout、Window、Tabbar、Accordion
|
|
工具、控件
|
使用步骤
1.使用myeclipse建立web project
2.加入DHX 支持(js、css、img)
3.提供数据源(此例使用XML 格式，在下载包中含有。附件中有下载)
4.在jsp页面中嵌入DHX代码 实现其功能
<body>
<div id=”gridbox” style=”width:900px;height:150px;”></div>
<br />
<script>
mygrid = new dhtmlXGridObject(‘gridbox’);
//图片路径
mygrid.setImagePath(“<%=path%>/img/”);
//表头设置用逗号分割每列(#master_checkbox 表示表头为checkbox，并支持全选)
mygrid.setHeader(“#master_checkbox,Sales,Book Title,Author,Price,In Store,Shipping,Bestseller,Date of Publication”);
//列宽
mygrid.setInitWidths(“45,57,150,120,80,80,80,80,200″);
//列位置
mygrid.setColAlign(“center,right,left,left,right,center,left,center,center”);
//列类型
mygrid.setColTypes(“ch,dyn,ed,txt,price,ch,coro,ra,ro”);
//列排序方式
mygrid.setColSorting(“na,int,str,str,int,str,str,str,date”);
//皮肤
mygrid.setSkin(“dhx_skyblue”);
mygrid.init();
//数据列拖拽
mygrid.enableColumnMove(true);
//表头列显示/隐藏
mygrid.enableHeaderMenu();
//加载数据
mygrid.loadXML(“<%=path%>/common/grid.xml”);
</script>
</body>