jquery Easyui快速开发总结


Posted in Javascript onAugust 20, 2015

最近工作很轻松,整理了些关于easyui的datagrid的开发文档,整理的比较细致,直接复制粘贴就可以使用了。

代码内容如下:

<link href="../../Content/easyUI/themes/default/easyui.css" rel="stylesheet" type="text/css" />
   <link href="../../Content/easyUI/themes/icon.css" rel="stylesheet" type="text/css" />
   <script src="../../Scripts/jquery-...min.js" type="text/javascript"></script>
   <script src="../../Scripts/jquery.easyui.min.js" type="text/javascript"></script>
   <script src="../../Scripts/easyui-lang-zh_CN.js" type="text/javascript"></script>
   <script src="../../Scripts/datapattern.js" type="text/javascript"></script>
 :<script type="text/javascript">
    $(function(){
       loadData();
    });
     function loadData() {
      $('#tt').datagrid({
         url: '/Home/GetUserInfo',
         title: '用户数据表格',
         width: ,
         height: ,
         fitColumns: true, //列自适应
         nowrap: false,
         idField: 'ID',//主键列的列明
         loadMsg: '正在加载用户的信息...',
         pagination: true,//是否有分页
         singleSelect: false,//是否单行选择
         pageSize:,//页大小,一页多少条数据
         pageNumber: ,//当前页,默认的
         pageList: [, , ],
         queryParams: {},//往后台传递参数
         columns: [[//c.UserName, c.UserPass, c.Email, c.RegTime
           { field: 'ck', checkbox: true, align: 'left', width: },
           { field: 'ID', title: '编号', width: },
           { field: 'UserName', title: '姓名', width: },
           { field: 'UserPass', title: '密码', width: },
            { field: 'Email', title: '邮箱', width: },
           { field: 'RegTime', title: '时间', width: , align: 'right',
             formatter: function (value, row, index) {
                 return (eval(value.replace(/\/Date\((\d+)\)\//gi, "new Date($)"))).pattern("yyyy-M-d");
               }
           }
         ]],
         toolbar: [{
           id: 'btnGet',
           text: '删除',
           iconCls: 'icon-add',
           handler: function () {
             var rows = $('#tt').datagrid('getSelections');
             if (!rows || rows.length == ) {
               //alert("请选择要修改的商品!");
               $.messager.alert("提醒", "请选择要删除的记录!", "error");
               return;
             }
           }
         }],
       });
     }
   </script>
 <div>
   <table id="tt" style="width: px;" title="标题,可以使用代码进行初始化,也可以使用这种属性的方式" iconcls="icon-edit">
   </table>
 </div>
  //将序列化成json格式后日期(毫秒数)转成日期格式
 function ChangeDateFormat(cellval) {
   var date = new Date(parseInt(cellval.replace("/Date(", "").replace(")/", ""), ));
   var month = date.getMonth() + < ? "" + (date.getMonth() + ) : date.getMonth() + ;
   var currentDate = date.getDate() < ? "" + date.getDate() : date.getDate();
   return date.getFullYear() + "-" + month + "-" + currentDate;
 }

以上代码示例给大家分享了jquery Easyui快速开发,希望大家喜欢。

Javascript 相关文章推荐
js单向链表的具体实现实例
Jun 21 Javascript
JavaScript自学笔记(必看篇)
Jun 23 Javascript
AngularJS入门教程之AngularJS 模板
Aug 18 Javascript
vue router仿天猫底部导航栏功能
Oct 18 Javascript
Javascript中绑定click事件的四种方式介绍
Oct 26 Javascript
如何为你的JavaScript代码日志着色详解
Apr 08 Javascript
Layui弹出层 加载 做编辑页面的方法
Sep 16 Javascript
微信小程序 textarea 层级过高问题简单解决方案
Oct 14 Javascript
tracking.js实现前端人脸识别功能
Apr 16 Javascript
解决Vue watch里调用方法的坑
Nov 07 Javascript
原生JS实现拖拽功能
Dec 16 Javascript
vue本地构建热更新卡顿的问题“75 advanced module optimization”完美解决方案
Aug 05 Vue.js
纯jquery实现模仿淘宝购物车结算
Aug 20 #Javascript
js实现按钮颜色渐变动画效果
Aug 20 #Javascript
jQuery+HTML5加入购物车代码分享
Oct 29 #Javascript
jQuery地图map悬停显示省市代码分享
Aug 20 #Javascript
jQuery超赞的评分插件(8款)
Aug 20 #Javascript
jQuery网页版打砖块小游戏源码分享
Aug 20 #Javascript
js实现鼠标点击文本框自动选中内容的方法
Aug 20 #Javascript
You might like
php实现的MySQL通用查询程序
2007/03/11 PHP
5种PHP创建数组的实例代码分享
2014/01/17 PHP
codeigniter中测试通过的分页类示例
2014/04/17 PHP
完美实现wordpress禁止文章修订和自动保存的方法
2014/11/03 PHP
jQuery实现的自动加载页面功能示例
2016/09/04 Javascript
jQuery加载及解析XML文件的方法实例分析
2017/01/22 Javascript
fckeditor部署到weblogic出现xml无法读取及样式不能显示问题的解决方法
2017/03/24 Javascript
关于Vue实现组件信息的缓存问题
2017/08/23 Javascript
React教程之Props验证的具体用法(Props Validation)
2017/09/04 Javascript
Node.js调用fs.renameSync报错(Error: EXDEV, cross-device link not permitted)
2017/12/27 Javascript
微信小程序实现日历功能
2018/11/27 Javascript
jQuery中each和js中forEach的区别分析
2019/02/27 jQuery
「中高级前端面试」JavaScript手写代码无敌秘籍(推荐)
2019/04/08 Javascript
js尾调用优化的实现
2019/05/23 Javascript
create-react-app中添加less支持的实现
2019/11/15 Javascript
jquery传参及获取方式(两种方式)
2020/02/13 jQuery
JS图片预加载三种实现方法解析
2020/05/08 Javascript
python进阶教程之模块(module)介绍
2014/08/30 Python
python指定写入文件时的编码格式方法
2018/06/07 Python
python设定并获取socket超时时间的方法
2019/01/12 Python
pyqt5 从本地选择图片 并显示在label上的实例
2019/06/13 Python
python之pexpect实现自动交互的例子
2019/07/25 Python
css3个性化字体_动力节点Java学院整理
2017/07/12 HTML / CSS
CSS3 transition 实现通知消息轮播条
2020/10/14 HTML / CSS
css3 利用transform打造走动的2D时钟
2020/10/20 HTML / CSS
美国最大的网上冲印店:Shutterfly
2017/01/01 全球购物
波兰品牌内衣及泳装网上商店:Astratex.pl
2017/02/03 全球购物
阿玛尼美妆俄罗斯官网:Giorgio Armani Beauty RU
2020/07/19 全球购物
如何保障Web服务器安全
2014/05/05 面试题
环境科学专业研究生求职信
2013/10/02 职场文书
机械设计专业应届生求职信
2013/11/21 职场文书
市场营销毕业生自荐信
2013/11/23 职场文书
党的群众路线教育学习材料
2014/05/12 职场文书
加强作风建设工作总结
2014/10/23 职场文书
幼儿园中班个人总结
2015/02/28 职场文书
Python装饰器详细介绍
2022/03/25 Python