jQuery EasyUI_Combo与Datagrid.2

来源：互联网发布：综合门户网站源码编辑：程序博客网时间：2024/06/06 01:26

首先看一下效果：

二、DataGrid数据表格组件，基本用法：

1、Class加载方式：

<table class="easyui-datagrid" data-options="width:290"><thead><tr><th data-options="field:'username'">角色名</th><th data-options="field:'conten'">角色描述</th><th data-options="field:'addtime'">添加时间</th><th data-options="field:'status'">是否开启</th></tr></thead><tbody><tr><td>超级管理员</td><td>最高权限</td><td>2015-1-1</td><td>开启</td></tr><tr><td>普通管理员</td><td>除系统设置外</td><td>2015-1-2</td><td>开启</td></tr><tr><td>编辑</td><td>仅能添加，修改</td><td>2015-1-3</td><td>开启</td></tr></tbody></table>

2、JS加载方式：

JS部分：

<script type="text/javascript">          $('#roleList').datagrid({          url:"{:U('SystManage/showRoleName')}",width : 400,title : '角色列表',iconCls : 'icon-search',columns : [[{field : 'rolename',title : '角色名',},{field : 'conten',title : '角色描述',},{field : 'addtime',title : '添加时间',},{field : 'status',title : '是否开启',},]],});        </script>

这里的URL，为数据库中加载来的数据表转换为JSON串。（我这里用的Tinkphp框架写的路由）

也可以手写一个JSON格式的数据：fieldname.json或其他形式的

HTML中的部分同样在Head部分加载Easyui，在body里面只需要写：

<table id="roleList"></table>

0 0