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 相关文章推荐
由JavaScript技术实现的web小游戏(不含网游)
Jun 12 Javascript
在js中判断checkboxlist(.net控件客户端id)是否有选中
Apr 11 Javascript
Lua表达式和控制结构学习笔记
Dec 15 Javascript
深入理解JavaScript系列(19):求值策略(Evaluation strategy)详解
Mar 05 Javascript
JS获取图片lowsrc属性的方法
Apr 01 Javascript
解决jQuery uploadify在非IE核心浏览器下无法上传
Aug 05 Javascript
JS模拟酷狗音乐播放器收缩折叠关闭效果代码
Oct 29 Javascript
javascript:void(0)是什么意思及href=#与href=javascriptvoid(0)的区别
Nov 13 Javascript
学习JavaScript设计模式(代理模式)
Dec 03 Javascript
JS实现按钮颜色切换效果
Sep 05 Javascript
微信小程序实现星星评价效果
Nov 02 Javascript
react实现复选框全选和反选组件效果
Aug 25 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
php 信息采集程序代码
2009/03/17 PHP
PHP mail 通过Windows的SMTP发送邮件失败的解决方案
2009/05/27 PHP
php实现jQuery扩展函数
2009/10/30 PHP
XAMPP升级PHP版本实现步骤解析
2020/09/04 PHP
Docker 安装 PHP并与Nginx的部署实例讲解
2021/02/27 PHP
JavaScript 事件参考手册
2008/12/24 Javascript
JQuery 学习笔记 element属性控制
2009/07/23 Javascript
javascript对下拉列表框(select)的操作实例讲解
2013/11/29 Javascript
javaScript 页面自动加载事件详解
2014/02/10 Javascript
Js实现手机发送验证码时按钮延迟操作
2014/06/20 Javascript
javascript实现模拟时钟的方法
2015/05/13 Javascript
用Angular实时获取本地Localstorage数据,实现一个模拟后台数据登入的效果
2016/11/09 Javascript
简单理解js的冒泡排序
2016/12/19 Javascript
easyUI combobox实现联动效果
2017/01/17 Javascript
React + webpack 环境配置的方法步骤
2017/09/07 Javascript
[原创]微信小程序获取网络类型的方法示例
2019/03/01 Javascript
JS实现可切换图片的幻灯切换效果示例
2019/05/24 Javascript
layui table数据修改的回显方法
2019/09/04 Javascript
vue点击自增和求和的实例代码
2019/11/06 Javascript
Element Backtop回到顶部的具体使用
2020/07/27 Javascript
[00:42]《辉夜杯》—职业组预选赛12月3日15点 正式打响
2015/12/03 DOTA
Python连接mssql数据库编码问题解决方法
2015/01/01 Python
在Python中使用成员运算符的示例
2015/05/13 Python
python执行精确的小数计算方法
2019/01/21 Python
Python应用领域和就业形势分析总结
2019/05/14 Python
Python数据可视化:箱线图多种库画法
2019/11/06 Python
美国汽车交易网站:Edmunds
2016/08/17 全球购物
仓库班组长岗位职责
2013/12/12 职场文书
自我评价的范文
2014/02/02 职场文书
2014年酒店工作总结范文
2014/11/17 职场文书
学籍证明模板
2015/06/18 职场文书
文明礼貌主题班会
2015/08/14 职场文书
企业内部管理控制:银行存款控制制度范本
2020/01/10 职场文书
「海贼王」112.9万粉丝纪念图标公布
2022/03/21 日漫
Nginx本地配置SSL访问的实例教程
2022/05/30 Servers
SQL Server携程核心系统无感迁移到MySQL实战
2022/06/01 SQL Server