easyui datagrid 学习 (一)
注意:当使用谷歌浏览器时!需要 设置style="overflow:hidden",这样则可以去掉滚动条!(该样式添加到layout上!)
fit:属性
自动填父容器,
border:属性
默认为true,设置为false时!去掉边框!
<body>
<table id="dg"></table>
<script type="text/javascript">
$(function() {
$('#dg').datagrid({
url : 'datagrid_data.json',
title : 'my数据表格', //标题
iconCls : '', //图表
pagination : true, //设置为true 在底部创建分页工具条
pageSize : 10, //初始化每页行数
pageList : [ 10, 20, 30, 40, 50 ],//设置可变每页行数
fit : true,
fitColumns : true, //自动设置列宽,设置该属性不会出现横向滚动条
nowrap : false, //如果单元格中的数据过大,则是否自己折行,默认是true不折行!
idField : 'code', //设置标识字段,如果设置该属性,在datagrid中选中的数据行,在进行翻页之后还是选中状态!
sortName:'name', //设置默认排序
sortOrder:'desc', //设置默认降序方式排序 注意: 排序设置现在只是前端完成配置,后台还需要根据返回的参数进行后续处理
columns : [ [ {
field : 'code',
title : 'Code',
width : 100,
sortable:true
}, {
field : 'name',
title : 'Name',
width : 100,
sortable:true
}, {
field : 'price',
title : 'Price',
width : 100,
align : 'right'
} ] ]
});
});
</script>
</body>
easyui datagrid 学习 (一)的更多相关文章
- easyUI datagrid学习笔记
1.easyUI表格的列属性 formatter:function(value,rowdata,rowindex) { return '['+value+']';//格式化,给每个值加上'[]': } ...
- easyui datagrid 学习
一.清空datagrid所有数据 //得到所有数据行 var item = $('#ylProductListDataGrid').datagrid('getRows'); if (item) { / ...
- 学习日记7、mvc +easyui datagrid excel上传
1.首先获取datagrid所有行的数据 var rows = $("#List").datagrid("getRows"); 2.进行数据转换转化成JSON格 ...
- EasyUI datagrid优化
easyui datagrid 在IE上加载速度慢, 150行数据就无法忍受了. firefox加载速度还可以. jquery easyui datagrid使用参考 http://www.cnblo ...
- 反射实体自动生成EasyUi DataGrid模板 第二版--附项目源码
之前写过一篇文章,地址 http://www.cnblogs.com/Bond/p/3469798.html 大概说了下怎么通过反射来自动生成对应EasyUi datagrid的模板,然后贴了很多 ...
- 解决easyui datagrid加载数据时,checkbox列没有根据checkbox的值来确定是否选中
背景: 昨天帮朋友做一个easyui datagrid的小实例时,才发现easyui datagrid的checkbox列,没有根据值为true或false来选中checkbox,当时感觉太让人失 ...
- 扩展jquery easyui datagrid编辑单元格
扩展jquery easyui datagrid编辑单元格 1.随便聊聊 这段时间由于工作上的业务需求,对jquery easyui比较感兴趣,根据比较浅薄的js知识,对jquery easyui中的 ...
- DataTables VS EasyUI DataGrid 基础应用 转
DataTables中文网推出了 第一篇 关于DataTables和其他表格插件比较后,为了把让这个比较更有意义,更能帮助到大家,DataTables中文网 做了问卷调查,根据小伙伴们的填写我归纳了一 ...
- .Net Mvc EasyUI DataGrid 分页
由于项目的需要,最近一直在学习 .net MVC 和EasyUI.上周写了一个<.Net Mvc 返回Json,动态生成EasyUI Tree>,今天再写一个EasyUI中另一个重要的组件 ...
随机推荐
- leetcode——1
1. 题目 Two Sum Given an array of integers, find two numbers such that they add up to a specific targ ...
- webpack最简单的入门教程里bundle.js之运行单步调试的原理解析
读这篇文章的朋友,请确保对webpack有最基础的认识. 您可以阅读我前一篇文章:Webpack 10分钟入门 来在本地运行一个Webpack的hello world项目.https://www.to ...
- SAP成都研究院的体育故事
"平生不识陈近南,纵称英雄也枉然". 这是清朝反government武装圈子里流传的一句话,给予了天地会CEO陈近南极高的评价. 同样,如果您是SAP体育运动界的一份子,而您还不认 ...
- 高级vim 配置
[root@chenbj ~]# pwd /root [root@chenbj ~]# cat .vimrc set nocompatible set pastetoggle=<F9> s ...
- CXF学习记录
1 apache CXF入门 1.1 下载 官网:cxf.apache.org 下载CXF的开发包: Apache CXF = Celtix + Xfire 支持多种协议: SOAP1.1,1.2 X ...
- 导航条(Navbar)
1.添加.navbar-fixed-top类可以让导航条固定的页面的顶部,固定的导航条会遮住页面上其它的内容,除非给body元素设置padding,导航条默认高度为50px ,因此可以给body元素设 ...
- VS Code 用户自定义代码片段(React)
VS Code 用户自定义代码片段(React) .jsxReact组件模板:javascriptreact.json { "Import React": { "pref ...
- VueX源码分析(3)
VueX源码分析(3) 还剩余 /module /plugins store.js /plugins/devtool.js const devtoolHook = typeof window !== ...
- 【前端_js】Chrome禁止缓存的方法
在前端开发中,浏览器缓存使得我们改了代码后页面不变,得经常手动清理缓存. 1.按如下操作即可禁用浏览器缓存, 这种方法基本能够做到完全禁止缓存,然而缺点是必须要将开发模式一直打开,占用屏幕空间.而且, ...
- 在生产环境下实现每天自动备份mysql数据库
1.描述 我相信很多朋友在工作都都会有这种需求,老板或领导让你每天都要备份mysql数据库,你该如何实现呢,是每天到一定的时间在服务器上敲一遍mysql的备份命令,还是想写个脚本,定时定点的自动备份呢 ...