jQuery LigerUI ligerGrid 在开发中的应用记录

 var  byNumberSwitch = "";
 var  intervalSwitch = "";
     
     //间隔设置方法
        var dayEditor = { type: ‘spinner‘, minValue: 0,onChanged:function(e){
         //提交数据
   var setNumber = e.value;//编辑结果
   var mendianID = e.record.mendianID;//编辑门店编号
   //判断设置数据没有改变,或者为空时跳出方法
   if(intervalSwitch ==setNumber || setNumber ==‘‘){
    liger.get("maingrid").updateCell(‘intervalSwitch‘, intervalSwitch, e.record);
    liger.get("maingrid").isDataChanged = false;
    return;
   }
         //将获取的数据提交到后台
   $.ligerDialog.waitting(‘正在保存中,请稍候...‘);
   $.post(‘show/mendianAction_set.action‘,{setNumber:setNumber,deptid:mendianID},function(data){
    var rtnflage = data.map.flage;
    //返回失败标志  还原修改数据 
    if(rtnflage == 1){
     liger.get("maingrid").updateCell(‘intervalSwitch‘, intervalSwitch, e.record);
     liger.get("maingrid").isDataChanged = false;
    }
    var mssage = data.map.msg;
    $.ligerDialog.closeWaitting(); 
            // $.ligerDialog.tip({  title: ‘提示信息‘,content:‘数据已经提交成功!‘+e.value });
             $.ligerDialog.alert(mssage, ‘提示‘,‘success‘);
   },‘json‘);
  } };
  //开关下拉框编辑数据
  var openData = [{ intervalSwitch: 1, text: ‘开‘ }, { intervalSwitch: 0, text: ‘关‘}];
  //开关编辑函数
  var openEditor = { type: ‘select‘, data: openData, valueField: ‘intervalSwitch‘,onChanged:function(e){
   //提交数据
   var flage = e.value;//编辑数据
   //判断设置数据没有改变,或者为空时跳出方法
   if(byNumberSwitch ==flage || flage ==‘‘){
    liger.get("maingrid").updateCell(‘byNumberSwitch‘, byNumberSwitch, e.record);
    liger.get("maingrid").isDataChanged = false;
    return;
   }
   //将获取的数据提交到后台
   $.ligerDialog.waitting(‘正在保存中,请稍候...‘);
   var mendianID = e.record.mendianID;//编辑门店编号
   $.post(‘show/mendianAction_open.action‘,{flage:flage,deptid:mendianID},function(data){
    var rtnflage = data.map.flage;
    //返回失败标志  还原修改数据 
    if(rtnflage == 1){
     liger.get("maingrid").updateCell(‘byNumberSwitch‘, byNumberSwitch, e.record);
     liger.get("maingrid").isDataChanged = false;
    }
    var mssage = data.map.msg;
    $.ligerDialog.closeWaitting(); 
             //$.ligerDialog.tip({  title: ‘提示信息‘,content:‘数据已经提交成功!‘+e.value });
             $.ligerDialog.alert(mssage, ‘提示‘,‘success‘);
   },‘json‘);}
  }
  
  //开关页面渲染函数
  function renderfun(rowdata,index,value){
   if(value==1){
    return ‘<span style="color: blue; font-weight: bold;">开 </span><img src="images/Setting.png" style="text-align:right; margin-left:10%; height:80%;width:40%;"/>‘;//"开";
   }else{
    return ‘关<img src="images/Setting.png" style="text-align:right; margin-left:15%; height:80%;width:40%;"/>‘;
   }
  }
  
  //间隔页面渲染函数
  function setrenderfun(rowdata,index,value){
   if(value >0){
    return ‘<span style="color: blue; font-weight: bold;">‘+value+‘</span><img src="images/Settings.png" style="text-align:right; margin-left:10%;height:50%;width:30%;"/>‘;
   }else{
    return ""+value+‘<img src="images/Settings.png" style="text-align:right; margin-left:25%;  height:50%;width:30%;"/>‘;
   }
  }
  //刷新函数
  var loaddata = function(){
         var key = $("#txtKey").val();
       if(key !=‘请输入关键字‘){
      grid.options.parms={"key":key};
       }else{
        if(grid){//对象存在的情况下
         grid.options.parms={"key":""};
        }
       }
        }
  //获取编辑前的数据
  var beforeEdit = function(e){
   byNumberSwitch = e.record.byNumberSwitch;
   intervalSwitch = e.record.intervalSwitch
  }
  $.ligerDefaults.GridString.isContinueByDataChanged = ‘表格数据有被改变,确认保存后继续?‘;
  //表格列表定义
        var grid = $("#maingrid").ligerGrid({
         url:"show/mendianAction_list.action",
         parms:{"key":""},
            columns: [
                { display: ‘门店编号‘, name: ‘mendianID‘, width: ‘10%‘,align:‘left‘,isSort:true},
                { display: ‘门店名称‘, name: ‘mendianName‘,textField:‘mendianName‘, width: ‘17%‘,align:‘left‘,isSort:true},
                { display: ‘门店地址‘, name: ‘mendianAdd‘, width: ‘27%‘,align:‘left‘,isSort:true},
                { display: ‘门店排号信息‘, columns: [
                    { display: ‘大桌‘, name: ‘byNumberOfBig‘, width: ‘12%‘,align:‘left‘,isSort:true},
                    { display: ‘中桌‘, name: ‘byNumberOfMiddle‘, width: ‘12%‘,align:‘left‘,isSort:true},
                    { display: ‘小桌‘, name: ‘byNumberOfLittle‘, width: ‘12%‘,align:‘left‘,isSort:true}
                ]},
    { display: ‘网络排号设置‘, columns: [
                    { display: ‘开关设置‘, name: ‘byNumberSwitch‘, width: ‘4%‘, align: ‘left‘, editor: openEditor,type:‘int‘,render:renderfun,isSort:true},
                    { display: ‘间隔设置‘, name: ‘intervalSwitch‘, width: ‘4%‘, align: ‘left‘,type:‘int‘, editor: dayEditor,render:setrenderfun,isSort:true}
                ]}
            ],
            //data: { Rows: data},
            height: ‘98%‘, rownumbers: true,usePager:true, enabledEdit:true,dataAction:"local",pageSizeOptions:[15, 20, 25, 30],
            pageSize:20,onLoadData:loaddata,onBeforeEdit:beforeEdit//,rowHeight:44
        });
  //隐藏提示框
  $("#pageloading").hide();
  //搜索函数
  function f_search(){
    var key = $("#txtKey").val();
    if(key !=‘请输入关键字‘){
     grid.loadServerData({"key":key});
    }else{
     grid.loadServerData({"key":""});
    }
        }

官方API:http://api.ligerui.com/

演示地址:http://www.ligerui.com/

源码下载:http://git.oschina.net/ligerui/LigerUI/

自我感觉jQuery LigerUI 是不错的ui框架,虽然还有一定的局限性和bug,但是还是值得一用的&middot;&middot;&middot;&middot;&middot;&middot;&middot;&middot;&middot;&middot;&middot;&middot;&middot;&middot;&middot;&middot;

jQuery LigerUI ligerGrid 在开发中的应用记录

时间: 2024-11-05 22:00:42

jQuery LigerUI ligerGrid 在开发中的应用记录的相关文章

jQuery.extend方法和开发中变量的复用

最近在用commonJS规范进行客户端开发,遇到如下问题: 一般一个模块内部可能会定义一系列变量或一系列相关变量,比如写了一个颜色选择弹框模块大概会有如下变量定义 var settings = { //设置它是否绝对定位 position: { //定位可以是绝对定位,可以是相对定位(需要有target),也可以是默认定位 type: "none", top: 30, left: 30, //表示相对于目标的定位 target: "", zindex: 0 }, /

java 组件开发中的日志记录问题

今天帮别人写封装几个url 请求,打成jar 包,可以以java接口的方式提供给外部访问. 遇到两个问题: 1. 是否把依赖的jar包也 打入 我要生成的jar包中,如果你不打入,别人直接调用接口会报错.如果你打入可能会和使用该jar包的项目发生冲突,因为别人可能已经引入了相关jar包. 自己可以根据要求来定: 如果不打就需要把jar和pom文件都提供给需求提出者. 如果需要可以使用maven 插件 maven-assembly-plugin. <plugin> <groupId>

开发中 常用 js 记录(一)

(1)获得URL参数 function GetQueryString("url参数名") {     var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");     var r = window.location.search.substr(1).match(reg);     if (r != null) return (r[2]); 

iOS开发中得一些记录

没看明白之一: Error handling When methods return an error parameter by reference, check the returned value, not the error variable. Preferred: NSError *error = nil; if (![self trySomethingWithError:&error]) { // Handle Error } Moreover, some of Apple's API

收集 - 实际开发中的技巧记录【页面】

文本类: ● 单行文本溢出显示省略号: 主要 CSS 属性是 text-overflow,值设为 ellipsis,另外需要给文本容器设置固定的 width 值.CSS 代码如下: overflow: hidden; text-overflow: ellipsis; white-space: nowrap; 123 123 原文地址:https://www.cnblogs.com/battlehawk/p/8492375.html

(转)jQuery Mobile 移动开发中的日期插件Mobiscroll 2.3 使用说明

(原)http://www.cnblogs.com/hxling/archive/2012/12/12/2814207.html jQuery Mobile 移动开发中的日期插件Mobiscroll 2.3 使用说明 近期在移动方面的开发,使用jQuery Mobile ,移动方面的插件不如Web 方面的插件多,选择的更少,有一些需要自己去封装,但功力尚不足啊. 日期插件JQM也提供了内置的,但样式方面不好看,只好百度.Google啦,找到了两款 jquery-mobile-datebox 和 

一个简单的特效引发的大战之移动开发中我为什么放弃jquery mobile

我本想安静的做一个美男子,可是,老板不涨工资,反而,一月不如一月. 我为什么放弃jquery mobile插件选择自己写特效? 在开发中大家都知道效率很重要,一个好的工具可以在开发中大大提升效率,工作做的越多,相应的取得的报酬也就越多,相反就是我自己了. 最近一直在一件事情上,移动线上网站测试必须符合3星,将不合格的网站调优后保证3星,方便线上推广,难免会遇见一些问题,大致为题后期会写一篇随笔总结,“移动开发中网站如何优化”.其中遇见的一个问题就是JS文件过大,CSS文件过大,之前项目一直使用的

jQuery开发中容易忽视的错误

1.引用jQuery库文件的<script>标签,必须放在引用自定义脚本文件的<script>标签之前,否则,就会发生找不到对象:最好在<head>元素中,把引入样式表的<link />放在<script>标签前面:有时候其他的javascript库也会用$符号,为了不冲突,可以使用.noConflict()方法把控制权交给别的库.    <script src="prototype.js" type="tex

一探前端开发中的JS调试技巧

前言:调试技巧,在任何一项技术研发中都可谓是必不可少的技能.掌握各种调试技巧,必定能在工作中起到事半功倍的效果.譬如,快速定位问题.降低故障概率.帮助分析逻辑错误等等.而在互联网前端开发越来越重要的今天,如何在前端开发中降低开发成本,提升工作效率,掌握前端开发调试技巧尤为重要. 本文将一一讲解各种前端JS调试技巧,也许你已经熟练掌握,那让我们一起来温习,也许有你没见过的方法,不妨一起来学习,也许你尚不知如何调试,赶紧趁此机会填补空白. 骨灰级调试大师Alert 那还是互联网刚刚起步的时代,网页前