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页面刷新的方法收集
Jul 02 Javascript
JS实现局部选择打印和局部不选择打印
Apr 03 Javascript
jQuery $.each遍历对象、数组用法实例
Apr 16 Javascript
JavaScript代码实现图片循环滚动效果
Mar 19 Javascript
AngularJS实现表单验证功能
Jan 09 Javascript
微信小程序 在线支付功能的实现
Mar 14 Javascript
JavaScript队列函数和异步执行详解
Jun 19 Javascript
ES6使用Set数据结构实现数组的交集、并集、差集功能示例
Oct 31 Javascript
Vue.js 中 axios 跨域访问错误问题及解决方法
Nov 21 Javascript
jQuery使用$.extend(true,object1, object2);实现深拷贝对象的方法分析
Mar 06 jQuery
Vue中的transition封装组件的实现方法
Aug 13 Javascript
layer实现登录弹框,登录成功后关闭弹框并调用父窗口的例子
Sep 11 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实现评委评分器
2015/07/31 PHP
PHP生成短网址方法汇总
2016/07/12 PHP
php实现将base64格式图片保存在指定目录的方法
2016/10/13 PHP
PHP实现对xml的增删改查操作案例分析
2017/05/19 PHP
tp5.1 框架查询表达式用法详解
2020/05/25 PHP
JavaScript中Math对象方法使用概述
2014/01/02 Javascript
JavaScript编程的10个实用小技巧
2014/04/18 Javascript
javascript模拟订火车票和退票示例
2014/04/24 Javascript
基于Bootstrap3表格插件和分页插件实例详解
2016/05/17 Javascript
JavaScript初学者必看“new”
2017/06/12 Javascript
js实现HTML中Select二级联动的实例
2018/01/05 Javascript
Vue2 轮播图slide组件实例代码
2018/05/31 Javascript
Angular5中调用第三方库及jQuery的添加的方法
2018/06/07 jQuery
微信小程序webview组件交互,内联h5页面并网页实现微信支付实现解析
2019/08/16 Javascript
Vue前端判断数据对象是否为空的实例
2020/09/02 Javascript
基于javascript实现移动端轮播图效果
2020/12/21 Javascript
一个超级简单的python web程序
2014/09/11 Python
深入理解Python中的元类(metaclass)
2015/02/14 Python
Python简明入门教程
2015/08/04 Python
解决django model修改添加字段报错的问题
2019/11/18 Python
python标准库os库的函数介绍
2020/02/12 Python
AUC计算方法与Python实现代码
2020/02/28 Python
在Python IDLE 下调用anaconda中的库教程
2020/03/09 Python
浅谈keras保存模型中的save()和save_weights()区别
2020/05/21 Python
Python pip安装第三方库实现过程解析
2020/07/09 Python
Python基于正则表达式实现计算器功能
2020/07/13 Python
整理HTML5中表单的常用属性及新属性
2016/02/19 HTML / CSS
HTML5中indexedDB 数据库的使用实例
2017/05/11 HTML / CSS
全球性的众包图形设计市场:DesignCrowd
2021/02/02 全球购物
物流仓储实习自我鉴定
2013/09/25 职场文书
导游的职业规划书范文
2013/12/27 职场文书
城市精细化管理实施方案
2014/03/04 职场文书
党校学习党性分析材料
2014/12/19 职场文书
给numpy.array增加维度的超简单方法
2021/06/02 Python
电脑无法安装Windows 11怎么办?无法安装Win11的解决方法
2021/11/21 数码科技
Apache Kafka 分区重分配的实现原理解析
2022/07/15 Servers