1 js中的datagrid需要添加两个css和两个js,
如:<link rel="stylesheet" type="text/css" href="../common/css/default/easyui.css"/>
<link rel="stylesheet" type="text/css" href="../common/css/icon.css"/>
<script type="text/javascript" language="javascript" src="../common/js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" language="javascript" src="../common/js/jquery.easyui.min.js"></script>
顺序不要颠倒,不然会出错。
而且需要将jsp语法去掉,例如去掉:<%........%>
2js中的datagrid是从后台得到json类型的数据,json类型的数据必须是像这样:{total:"10",rows:[{a:"a",b:"b"},{d:"d",e:"e"}]}
从后台传递过来的json数据类型,通过ajax来执行。
如:jQuery.ajax({
url:"webServiceAction!DataGrid_execute",
type:"post",
dataType:"json",
success:function(resultJson){
//alert(JSON.stringify(resultJson));
datagrid_js(resultJson);
}
});
3 datagrid来显示出来,通过json数据。
如:function datagrid_js(resultJson){
var dataJson=resultJson;
dataJson.total=resultJson.total;
dataJson.rows=resultJson.rows;
$("#tt1").datagrid({
title:"title1",
width:300,
height:200,
columns:[[
{checkbox:"Y"},
{field:"rownum",title:"我",width:20},
{field:"name",title:"bb",width:50},
{field:"password",title:"cc",width:80},
{field:"ab",title:"按钮",formatter:function(value,rowData,rowIndex){
return "<input type='button' id='button_"+rowIndex+"' value='button'/>";
}}
]]
});
$("#tt1").datagrid("loadData",resultJson);
}
综述:通过<table id="tt1"></table>来这样为其赋值。
jquery中的写法:$("#tt1").datagrid({});
columns为显示的字段。
checkbox为显示复选框。
field为使用哪一个字段的值。
title为标题。
formatter为解析处理函数,参数value为值,rowData为整个rows里的值。rowIndex为第几个。需要有返回值。
如:<link rel="stylesheet" type="text/css" href="../common/css/default/easyui.css"/>
<link rel="stylesheet" type="text/css" href="../common/css/icon.css"/>
<script type="text/javascript" language="javascript" src="../common/js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" language="javascript" src="../common/js/jquery.easyui.min.js"></script>
顺序不要颠倒,不然会出错。
而且需要将jsp语法去掉,例如去掉:<%........%>
2js中的datagrid是从后台得到json类型的数据,json类型的数据必须是像这样:{total:"10",rows:[{a:"a",b:"b"},{d:"d",e:"e"}]}
从后台传递过来的json数据类型,通过ajax来执行。
如:jQuery.ajax({
url:"webServiceAction!DataGrid_execute",
type:"post",
dataType:"json",
success:function(resultJson){
//alert(JSON.stringify(resultJson));
datagrid_js(resultJson);
}
});
3 datagrid来显示出来,通过json数据。
如:function datagrid_js(resultJson){
var dataJson=resultJson;
dataJson.total=resultJson.total;
dataJson.rows=resultJson.rows;
$("#tt1").datagrid({
title:"title1",
width:300,
height:200,
columns:[[
{checkbox:"Y"},
{field:"rownum",title:"我",width:20},
{field:"name",title:"bb",width:50},
{field:"password",title:"cc",width:80},
{field:"ab",title:"按钮",formatter:function(value,rowData,rowIndex){
return "<input type='button' id='button_"+rowIndex+"' value='button'/>";
}}
]]
});
$("#tt1").datagrid("loadData",resultJson);
}
综述:通过<table id="tt1"></table>来这样为其赋值。
jquery中的写法:$("#tt1").datagrid({});
columns为显示的字段。
checkbox为显示复选框。
field为使用哪一个字段的值。
title为标题。
formatter为解析处理函数,参数value为值,rowData为整个rows里的值。rowIndex为第几个。需要有返回值。