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 相关文章推荐
VBScript版代码高亮
Jun 26 Javascript
javascript prototype 原型链
Mar 12 Javascript
cloudgamer出品ImageZoom 图片放大效果
Apr 01 Javascript
如何确保JavaScript的执行顺序 之jQuery.html并非万能钥匙
Mar 03 Javascript
JS获取月的最后一天与JS得到一个月份最大天数的实例代码
Dec 16 Javascript
浅析AngularJs HTTP响应拦截器
Dec 28 Javascript
javascript弹出窗口中增加确定取消按钮
Jun 24 Javascript
前端编码规范(3)JavaScript 开发规范
Jan 21 Javascript
Java中int与integer的区别(基本数据类型与引用数据类型)
Feb 19 Javascript
Vue拖拽组件列表实现动态页面配置功能
Jun 17 Javascript
vue 自动化路由实现代码
Sep 03 Javascript
如何基于layui的laytpl实现数据绑定的示例代码
Apr 10 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+mysql写的简单留言本实例代码
2008/07/25 PHP
php Undefined index的问题
2009/06/01 PHP
Memcached常用命令以及使用说明详解
2013/06/27 PHP
php快速查找数据库中恶意代码的方法
2015/04/01 PHP
php装饰者模式简单应用案例分析
2019/10/23 PHP
多广告投放代码 推荐
2006/11/13 Javascript
javascript 面向对象思想 附源码
2009/07/07 Javascript
Extjs ajax同步请求时post方式参数发送方式
2009/08/05 Javascript
Jquery 自定义动画概述及示例
2013/03/29 Javascript
页面实时更新时间的JS实例代码
2013/12/18 Javascript
node.js中的fs.ftruncate方法使用说明
2014/12/15 Javascript
js函数与php函数的区别实例浅析
2015/01/12 Javascript
JavaScript操作Cookie详解
2015/02/28 Javascript
JavaScript数组前面插入元素的方法
2015/04/06 Javascript
JavaScript动态创建form表单并提交的实现方法
2015/12/10 Javascript
BootStrap学习系列之布局组件(下拉,按钮组[toolbar],上拉)
2017/01/03 Javascript
jQuery插件echarts实现的单折线图效果示例【附demo源码下载】
2017/03/04 Javascript
Bootstrap datepicker日期选择器插件使用详解
2017/07/26 Javascript
Vue.js实现实例搜索应用功能详细代码
2017/08/24 Javascript
详解vue-cli中的ESlint配置文件eslintrc.js
2017/09/25 Javascript
vue中的provide/inject的学习使用
2018/05/09 Javascript
微信小程序自定义导航栏实例代码
2019/04/05 Javascript
微信小程序静默登录的实现代码
2020/01/08 Javascript
python多线程编程方式分析示例详解
2013/12/06 Python
web.py 十分钟创建简易博客实现代码
2016/04/22 Python
python网络应用开发知识点浅析
2019/05/28 Python
python实现人工智能Ai抠图功能
2019/09/05 Python
Python类绑定方法及非绑定方法实例解析
2020/10/09 Python
Python读写csv文件流程及异常解决
2020/10/20 Python
什么是URL
2015/12/13 面试题
2014年幼儿园元旦活动方案
2014/02/13 职场文书
社区班子个人对照检查材料思想汇报
2014/10/07 职场文书
2016年清明节寄语
2015/12/04 职场文书
基于python的matplotlib制作双Y轴图
2021/04/20 Python
Golang数据类型和相互转换
2022/04/12 Golang
MySQL自定义函数及触发器
2022/08/05 MySQL