在DHTMLX网格中将网格与选项卡集成

时间:2013-08-05 09:37:44

标签: jquery grid dhtmlx

您好我正在使用Dhtmlx Grid ..我需要dhtmlx tabbar ...从他们的网站引用(http://www.dhtmlx.com/docs/products/dhtmlxTabbar/samples/05_components/01_grid_inside.html),i开始知道初始化网格..我做了这个..但标签部分没有stil工作..让我知道我在哪里纠正代码..我的代码是

    <%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>


<!-- dhtmlxGrid -->

<link rel="stylesheet" type="text/css" href="../dhtmlxGrid/codebase/dhtmlxgrid.css">
<link rel="stylesheet" type="text/css" href="../dhtmlxGrid/codebase/skins/dhtmlxgrid_dhx_skyblue.css">
<link rel="STYLESHEET" type="text/css" href="../codebase/css/dhtmlxtabbar.css">
<script  src="../codebase/dhtmlxcommon.js"></script>
<script src="../codebase/dhtmlxgrid.js"></script>
<script  src="../codebase/ext/dhtmlxgrid_srnd.js"></script>
<script src="../codebase/dhtmlxgridcell.js"></script>
<script src="../codebase/dhtmlxcontainer.js"></script>
<script  src="../codebase/dhtmlxtabbar.js"></script>


<script type="text/javascript">

</script>
</head>
<body>


<div id="gridbox" style="width:600px;height:200px">
<div id="a_tabbar" style="width:395px; height:390px;"></div>
</div>
<script>//Loading data from XML:

 mygrid = new dhtmlXGridObject('gridbox');
    mygrid.setImagePath("../codebase/imgs/");
    mygrid.setHeader("Name,Index,Code");
    mygrid.setInitWidths("150,150,*");
    mygrid.setColAlign("left,left");
    mygrid.setColSorting("str,str,str");
    mygrid.setColTypes("txt,txt,txt");
    mygrid.setSkin("dhx_skyblue");
    mygrid.loadXML("../grid.xml");//load data */ 
    mygrid.init();
  tabbar = new dhtmlXTabBar("a_tabbar", "top");
    tabbar.setSkin('dhx_skyblue');
    tabbar.setImagePath("codebase/imgs/");
    tabbar.addTab("a1", "Tab 1-1", "100px");
    tabbar.addTab("a2", "Tab 1-2", "100px");
    tabbar.setTabActive("a1");
    mygrid = tabbar.cells("a1").attachGrid();
    mygrid.setImagePath("../../../dhtmlxGrid/codebase/imgs/"); 
    mygrid.attachEvent("onRowSelect", function(rowId,cIndex){alert(rowId)});
    </script>
</body>
</html>

1 个答案:

答案 0 :(得分:0)

采取下一种方式:

tabbar = new dhtmlXTabBar("a_tabbar", "top");
tabbar.setSkin('dhx_skyblue');
tabbar.setImagePath("codebase/imgs/");
tabbar.addTab("a1", "Tab 1-1", "100px");
tabbar.addTab("a2", "Tab 1-2", "100px");
tabbar.setTabActive("a1");  

mygrid = tabbar.cells("a1").attachGrid();
mygrid.setImagePath("../codebase/imgs/");
mygrid.setHeader("Name,Index,Code");
mygrid.setInitWidths("150,150,*");
mygrid.setColAlign("left,left");
mygrid.setColSorting("str,str,str");
mygrid.setColTypes("txt,txt,txt");
mygrid.setSkin("dhx_skyblue");
mygrid.attachEvent("onRowSelect", function(rowId,cIndex){alert(rowId)});
mygrid.loadXML("../grid.xml");//load data */ 
mygrid.init();