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 相关文章推荐
更优雅的事件触发兼容
Oct 24 Javascript
获取offsetTop和offsetLeft值的js代码(兼容)
Apr 16 Javascript
jQuery中removeClass()方法用法实例
Jan 05 Javascript
JS获取图片高度宽度的方法分享
Apr 17 Javascript
jQuery带时间的日期控件代码分享
Aug 26 Javascript
js 右侧浮动层效果实现代码(跟随滚动)
Nov 22 Javascript
jQuery实现iframe父窗体和子窗体的相互调用
Jun 17 Javascript
详解vue+vueRouter+webpack的简单实例
Jun 17 Javascript
webpack4的迁移的使用方法
May 25 Javascript
JavaScript如何实现元素全排列实例代码
May 14 Javascript
浅入深出Vue之组件使用
Jul 11 Javascript
jQuery+PHP+Ajax实现动态数字统计展示功能
Dec 25 jQuery
纯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
Linux下将excel数据导入到mssql数据库中的方法
2010/02/08 PHP
php中的ini配置原理详解
2014/10/14 PHP
ThinkPHP使用getlist方法实现数据搜索功能示例
2017/05/08 PHP
PHP数组内存利用率低和弱类型详细解读
2017/08/10 PHP
PHP折半(二分)查找算法实例分析
2018/05/12 PHP
PHP高并发和大流量解决方案整理
2021/03/09 PHP
extjs 学习笔记(三) 最基本的grid
2009/10/15 Javascript
JQuery筛选器全系列介绍
2013/08/27 Javascript
js操作table示例(个人心得)
2013/11/29 Javascript
JS将数字转换成三位逗号分隔的样式(示例代码)
2014/02/19 Javascript
node.js中的fs.openSync方法使用说明
2014/12/17 Javascript
深入探密Javascript数组方法
2015/01/08 Javascript
JavaScript实现带缓冲效果的随屏滚动漂浮广告代码
2015/11/06 Javascript
javascript特效实现——当前时间和倒计时效果的简单实例
2016/07/20 Javascript
JavaScript中的对象和原型(一)
2016/08/12 Javascript
AngularJS 霸道的过滤器小结
2017/04/26 Javascript
vue实现微信分享朋友圈,发送朋友的示例讲解
2018/02/10 Javascript
Nodejs对postgresql基本操作的封装方法
2019/02/20 NodeJs
如何在微信小程序里面退出小程序的方法
2019/04/28 Javascript
详解vue微信网页授权最终解决方案
2019/06/16 Javascript
vue通过数据过滤实现表格合并
2020/11/30 Javascript
npx create-react-app xxx创建项目报错的解决办法
2020/02/17 Javascript
JSONObject与JSONArray使用方法解析
2020/09/28 Javascript
详解Python中的正则表达式的用法
2015/04/09 Python
python版本的仿windows计划任务工具
2018/04/30 Python
PyTorch基本数据类型(一)
2019/05/22 Python
Python爬取视频(其实是一篇福利)过程解析
2019/08/01 Python
Django中URL的参数传递的实现
2019/08/04 Python
基于python实现的百度音乐下载器python pyqt改进版(附代码)
2019/08/05 Python
python实现IOU计算案例
2020/04/12 Python
基于打开pycharm有带图片md文件卡死问题的解决
2020/04/24 Python
自考自我鉴定范文
2013/10/30 职场文书
中国好声音华少广告词
2014/03/17 职场文书
三好学生主要事迹怎么写
2015/11/03 职场文书
Vue3 Composition API的使用简介
2021/03/29 Vue.js
SpringBoot集成Redis,并自定义对象序列化操作
2021/06/22 Java/Android