• jqGrid排序的两种实现方式


    实现方案一客户端实现排序:
    jqGrid属性 loadonce:true时,所有数据加载在客户端,点击列标题由jqGrid在客户端自动排序,不再从服务器取值。
    参考文件:ccMxCxTjCc.js
    js设定:
    jqGrid的设定:
    colModel: [
    {
    .....
    name: ‘zykj‘,
    sortable: true,
    },
    ......
    }],
    ......
    loadonce:true, //一次加载全部数据到客户端,由客户端进行排序。
    sortable: true,
    sortname: ‘zykj‘, //设置默认的排序列
    sortorder: ‘asc‘,
     
     
    实现方案二:sql排序
    在Model层加入,需要生成setter、getter方法。
    // sidx和sord是jqGrid存在的变量,接受列点击之后传过来的值。
    /*
    * sord代表排序规则(asc、desc)
    */
    private String sord;
    /**
    * sidx代表排序的列名
    */
    private String sidx;
    /**
    * sord代表排序规则(asc、desc)
    * @return sord
    */
    public String getSord() {
    return sord;
    }

    /*
    * 设置 sord代表排序规则(asc、desc)
    * @param sord
    */
    public void setSord(String sord) {
    this.sord = sord == null ? null : sord.trim();
    }

    /**
    * 获取 sidx代表排序的列名
    * @return 获取sidx代表排序的列名
    */
    public String getSidx() {
    return sidx;
    }

    /**
    * 设置 sidx代表排序的列名
    * @param sidx
    */
    public void setSidx(String sidx) {
    this.sidx = sidx == null ? null : sidx.trim();
    }
    jqGrid:
    colModel:
    sortable: true,
    jqGrid属性:
    sortable: true,
    sortname: ‘zykj‘, //设置默认的排序列
    sortorder: ‘asc‘,
    loadonce:false, //一次加载全部数据到客户端,由客户端进行排序。
    jqGrid的onSortCol在简单排序时,不需要设定。
    //onSortCol: function (index, colindex, sortorder) {
    // jqGridTable.setGridParam({
    //sortorder排序规则 asc、desc
    //colindex列索引 0开始
    //index:列name、’zykj’
    // }).trigger("reloadGrid");
    //},
     
    Mybatis配置文件:
    SELECT的xml设定不需要配置statement=”STATEMENT”,sidx、sord的传入使用$符号。不适用#。
    <select id="pagesList" parameterType="com.entity.model.ModelDemo" resultMap="BaseResultMap" >
    SELECT
    T1.SJHS
    , T1.ZYKJ
    FROM TABLE T1
    WHERE 0=0
    <if test="sidx != null and sord!=‘‘ and sord != null and sidx != ‘‘">
    ORDER BY T1.${sidx} ${sord}
    </if>
    </select>
  • 相关阅读:
    设计模式
    雨夹雪背景特效
    lottie-前端实现AE动效
    响应式布局实现原理
    关于小程序(含uniapp)中使用npm模块
    使用脚手架快速搭建React项目
    vue项目接入友盟统计站点数据
    git常用命令
    uniapp请求方法的封装
    小程序获取用户登录及手机号登录
  • 原文地址:https://www.cnblogs.com/shizhijie/p/7844489.html
Copyright © 2020-2023  润新知