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 相关文章推荐
ASP.NET jQuery 实例12 通过使用jQuery validation插件简单实现用户注册页面验证功能
Feb 03 Javascript
快速查找数组中的某个元素并返回下标示例
Sep 03 Javascript
javascript电商网站抢购倒计时效果实现
Nov 19 Javascript
Jquery Easyui菜单组件Menu使用详解(15)
Dec 18 Javascript
vue2.0父子组件间通信的实现方法
Apr 19 Javascript
微信小程序获取微信运动步数的实例代码
Jul 20 Javascript
解析Json字符串的三种方法日常常用
May 02 Javascript
vue项目中使用lib-flexible解决移动端适配的问题解决
Aug 23 Javascript
vue服务端渲染添加缓存的方法
Sep 18 Javascript
vue使用原生js实现滚动页面跟踪导航高亮的示例代码
Oct 25 Javascript
vue-cli 2.*中导入公共less文件的方法步骤
Nov 22 Javascript
IntelliJ IDEA编辑器配置vue高亮显示
Sep 26 Javascript
纯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
几种显示数据的方法的比较
2006/10/09 PHP
自己前几天写的无限分类类
2007/02/14 PHP
Ha0k 0.3 PHP 网页木马修改版
2009/10/11 PHP
将PHP从5.3.28升级到5.3.29时Nginx出现502错误
2015/05/09 PHP
PHP使用PDO操作数据库的乱码问题解决方法
2016/04/08 PHP
Zend Framework实现自定义过滤器的方法
2016/12/09 PHP
PHPMailer发送邮件
2016/12/28 PHP
IE与firefox之jquery用法区别
2008/10/03 Javascript
javaScript复制功能调用实现方案
2012/12/13 Javascript
js禁止页面刷新禁止用F5键刷新禁止右键的示例代码
2013/09/23 Javascript
文本域光标操作的jQuery扩展分享
2014/03/10 Javascript
让浏览器DOM元素最后加载的js方法
2014/07/29 Javascript
node.js中的path.extname方法使用说明
2014/12/09 Javascript
Javascript实现Array和String互转换的方法
2015/12/21 Javascript
有关jQuery中parent()和siblings()的小问题
2016/06/01 Javascript
VC调用javascript的几种方法(推荐)
2016/08/09 Javascript
DVA框架统一处理所有页面的loading状态
2017/08/25 Javascript
ES6使用Set数据结构实现数组的交集、并集、差集功能示例
2017/10/31 Javascript
Vue实现腾讯云点播视频上传功能的实现代码
2020/08/17 Javascript
让Vue响应Map或Set的变化操作
2020/11/11 Javascript
[03:42]2014DOTA2西雅图国际邀请赛7月9日TOPPLAY
2014/07/09 DOTA
使用Python从有道词典网页获取单词翻译
2016/07/03 Python
python发送邮件脚本
2018/05/22 Python
实用自动化运维Python脚本分享
2018/06/04 Python
python 判断三个数字中的最大值实例代码
2019/07/24 Python
Python常用数据类型之间的转换总结
2019/09/06 Python
解决Pytorch训练过程中loss不下降的问题
2020/01/02 Python
Python实现序列化及csv文件读取
2020/01/19 Python
TensorFlow MNIST手写数据集的实现方法
2020/02/05 Python
python 读取串口数据的示例
2020/11/09 Python
Pycharm中使用git进行合作开发的教程详解
2020/11/17 Python
娇韵诗加拿大官网:Clarins加拿大
2017/11/20 全球购物
上海天奕面试题笔试题
2015/04/19 面试题
毕业生简单求职信
2013/11/19 职场文书
十八大感想感言
2014/02/10 职场文书
2014年信用社工作总结
2014/11/25 职场文书