这个我已经找到办法了
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>"> <title>My JSP 'regPage.jsp' starting page</title> <meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<link rel="stylesheet" type="text/css" href="skins/dhx_skyblue/dhtmlx.css" />
<link rel="stylesheet" type="text/css" href="skins/dhx_skyblue/dhxsino.css" />
<script src="skins/dhx_skyblue/dhtmlx.js"></script>
<style>
div#layoutObj {
position: relative;

margin: 0px;
  padding: 0px;
width: 100%;
height: 100%;
}
</style>

<script>
var myLayout,myGrid,myGrid1;
var data={
rows:[
{ id:1001, data:["-1","100", "A Time to Kill", "John Grisham"] },
{ id:1002, data:["1","1000","Blood and Smoke","Stephen King"] },
{ id:1003,data:[ "0","-200", "The Rainmaker","John Grisham"] },
{ id:1004,data:[ "0","-200", "The Rainmaker","John Grisham"] },
{ id:1005,data:[ "0","-200", "The Rainmaker","John Grisham"] },
{ id:1006,data:[ "0","-200", "The Rainmaker","John Grisham"] }
   ]
};
  function doOnLoad() {
myLayout = new dhtmlXLayoutObject({
parent: "layoutObj",
pattern: "3W",
cells: [{id: "a", text: "用户"},{id: "b", text: "角色"},{id: "c", text: "资源"}]
});
myGrid = myLayout.cells("a").attachGrid();
myGrid.setImagePath("skins/dhx_skyblue/imgs/");
myGrid.setHeader("选择,Sales, Book Title, Author");
myGrid.setInitWidths("50,100,170,*");
myGrid.setColAlign("center,right,center,center");
myGrid.setColTypes("ra,dyn,ed,ed");
myGrid.setColSorting("str,int,str,str");
myGrid.setSkin("dhx_skyblue");
myGrid.init();
myGrid.attachFooter(["<div id='grid_1_recinfoArea' style='width:100%;height:100%'></div>","#cspan","#cspan"],['height:100%;text-align:left;background:transparent;border-color:white;padding:0px;']);
myGrid.enablePaging(true, 6,  3,'grid_1_recinfoArea');
myGrid.setPagingSkin('toolbar','dhx_skyblue');
myGrid.parse(data,"json");  
myGrid1 = myLayout.cells("b").attachGrid();
myGrid1.setImagePath("skins/dhx_skyblue/imgs/");
myGrid1.setHeader("选择,Sales, Book Title, Author");
myGrid1.setInitWidths("50,100,170,*");
myGrid1.setColAlign("center,right,center,center");
myGrid1.setColTypes("ch,dyn,ed,ed");
myGrid1.setColSorting("str,int,str,str");
myGrid1.setSkin("dhx_skyblue");

myGrid1.init();
myGrid1.parse(data,"json");  }
</script>
</head> <body onload="doOnLoad();">
<div id="layoutObj"></div>
<tr>
<td>
<div id="recinfoArea"></div>
</td>
</tr>
</body>
</html>