jquery Easyui 빠른 개발 summary_jquery

최근에는 easyui의 데이터 그리드에 대한 몇 가지 개발 문서를 편집했습니다. 매우 상세하고 복사하여 붙여넣기만 하면 바로 사용할 수 있습니다.

코드 내용은 다음과 같습니다.

 <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() + < &#63; "" + (date.getMonth() + ) : date.getMonth() + ;
   var currentDate = date.getDate() < &#63; "" + date.getDate() : date.getDate();
   return date.getFullYear() + "-" + month + "-" + currentDate;
 }

위의 코드 예제는 jquery Easyui의 급속한 발전을 여러분과 공유합니다. 마음에 드셨으면 좋겠습니다.