求大大给个完整点代码,谢谢!
刚接触Extjs,但是还不会在jsp中写Extjs代码,已经把Extjs封到jsp中,
<g:head useFlash="false" useExt="true"/>
只要写Extjs代码实现border布局,分成左右两个容器就ok了。
多给点注释,谢谢啦!
布局
jsp
extjs
------解决方案--------------------
jsp
<div id="myGrid" style="padding: 0px; overflow: hidden;"></div>
我用的div来套,给定ID,js里面定义好ext的控件,然后放入div中
grid_user = new Ext.grid.GridPanel({
stripeRows: true, // 斑马线效果
width:'100%',
region:'center',
loadMask: true,
enableColumnMove:false,
store: ds,
loadMask: true,
viewConfig:{
forceFit:true
},
columns:[
new Ext.grid.RowNumberer({
width: 40,sortable: true
}),
{
header: "警号",
dataIndex: 'USERID',
sortable: true
},{
header: "姓名",
dataIndex: 'USERNAME',
sortable: true
},{
header: "部门编号",
dataIndex: 'UNITID',
align: 'left',
sortable: true
},{
header: "部门名称",
dataIndex: 'UNITNAME',
width: 200,
align: 'left',
sortable: true
},{
id: 'last',
header: "操作",
dataIndex: 'STATUS',
width:100,
renderer: function (value, meta, record) {
//在这里定义了3个操作,分别赋予不同的css class以便区分
var formatStr
if(value == '1'){
formatStr = "<a href='javascript:void({0});' onclick='javascript:return false;' class='alarm_update' style='color:blue'>修改</a>
------解决方案--------------------
" +
"<a href='javascript:void({1});' onclick='javascript:return false;' class='alarm_stop' style='color:red'>停用</a>";
}else{
formatStr = "<a href='javascript:void({0});' onclick='javascript:return false;' class='alarm_update' style='color:blue'>修改</a>
------解决方案--------------------
" +
"<a href='javascript:void({1});' onclick='javascript:return false;' class='alarm_open' style='color:red'>启用</a>";
}
var resultStr = String.format(formatStr, record.get('id'), record.get('id'), record.get('id'));