JQueryEasyUIdatagrid框架的基本使用资源-CSDN文库

context

data

28 浏览量 2020-12-03 13:06:17 上传评论收藏 74KB PDF 举报

资源推荐

资源详情

资源评论

JQueryEasyUI datagrid框架的基本使用框架的基本使用

今天说说这个datagrid框架的基本使用，这个框架一直以来都是大家比较头疼的框架，尤其是Json数据的拼接，后台前台都很

重要，使用这个框架，最重要的是仔细：

无需废话，上代码了：

代码如下:

<!–easyui最全的样式包也可单独引用你想使用的样式包–>

<!–easyui自带图片样式包，也可自行添加–>

<!–我使用的是easyui 1.3.2，基于jquery-1.8.0–>

<!–easyui的js包–>

<!–easyui的中文语言包，默认是英文–>

</head>

</div>

</div>

</div>

</div>

<div data-options=”region:’center’,title:’center title'” href=”HTMLPage.htm” style=”padding: 5px;

background: #eee; overflow: hidden;”><!–这里指向了一个htm页–>

</div>

</body>

</html>

HTMLPage.htm代码：

代码如下:

//因为layout框架指向href时，只取html页面body中间的部分，所以该页面这样写即可

//有datagrid包含属性较多，所以尽量使用js的方式初始化datagrid框架

$(function () {

$(“#dg”).datagrid({

url: “GetJson.ashx”, //指向一个一般处理程序或者一个控制器，返回数据要求是Json格式，直接赋值Json格式数据也可，我以

demo中自带的Json数据为例，就不写后台代码了，但是我会说下后台返回的注意事项

title: “数据展示表格”,

iconCls: “icon-add”,

fitColumns: false, //设置为true将自动使列适应表格宽度以防止出现水平滚动,false则自动匹配大小

//toolbar设置表格顶部的工具栏，以数组形式设置

idField: ‘id’, //标识列，一般设为id，可能会区分大小写，大家注意一下

loadMsg: “正在努力为您加载数据”, //加载数据时向用户展示的语句

pagination: true, //显示最下端的分页工具栏

rownumbers: true, //显示行数 1，2，3，4…

pageSize: 10, //读取分页条数，即向后台读取数据时传过去的值

pageList: [10, 20, 30], //可以调整每页显示的数据，即调整pageSize每次向后台请求数据时的数据

//由于datagrid的属性过多，我就不每个都介绍了，如有需要，可以看它的API

sortName: “name”, //初始化表格时依据的排序字段必须和数据库中的字段名称相同

sortOrder: “asc”, //正序

columns: [[

{ field: ‘code’, title: ‘Code’, width: 100 },

{ field: ‘name’, title: ‘Name’, width: 100 ,sortable:true},//sortable:true点击该列的时候可以改变升降序

{ field: ‘addr’, title: ‘addr’, width: 100,

//这里可以添加这样一个方法，使其显示数据得到改变

// formatter: function (value, row, index) {

// if (value == “0”) {

// return “普通角色”;

// } else {

// return “特殊角色”;

// }

}

本内容试读结束，登录后可阅读更多

下载后可阅读完整内容，剩余3页未读，立即下载

评论收藏

内容反馈

weixin_38548704

粉丝: 3
资源: 931

JQueryEasyUI datagrid框架的基本使用

JQueryEasyUI datagrid框架的进阶使用

JQueryEasyUI Layout布局框架的使用

jquery easyui datagrid demo

JqueryEasyUI DataGrid例子

jquery easyui datagrid 教程

jquery easyui datagrid demo 详解

easyui datagrid 右冻结

easyui datagrid 表格 打印

easyui datagrid 增加鼠标悬停弹窗事件

Jquery EasyUI 页面框架Demo

JS EasyUI DataGrid动态加载数据

解决EasyUIdataGrid列比较多，无数据，列展现不全

jQuery EasyUI datagrid实现本地分页的方法

jQuery EasyUI v1.10.0.zip

EasyUI DataGrid过滤用法实例

easyui的datagrid生成合并行,合计计算价格

easyui datagrid 分页查询样例

jquery easyui 表头固定 datagrid 弹出框 AJAX刷新页面

easyui datagrid 多条件筛选 可复选 类似淘宝筛选

jquery easyui 帮助文档

Jquery easyui项目框架

easyui datagrid标题列宽度自适应

漂亮的jquery easyui后台框架

easy ui datagrid项目完整源代码

jQuery EasyUI的api

初试JqueryEasyUI（附Demo）

easyUI的dataGrid的使用DEMO

最新资源

easyui datagrid 表格打印

easyui datagrid 多条件筛选可复选类似淘宝筛选