zoukankan      html  css  js  c++  java
  • BootstrapTable表格点击字段排序

     
    <table id="group-table" data-toggle="table" class="table table-striped table-hover" style="border: 1px solid #e4eaec; margin-top: 10px;"></table>
    //获取共享组
    var $groupTable = $('#group-table').bootstrapTable('destroy').bootstrapTable({
        url: '/kscd/api/share-group/',
        method: 'GET',
        dataType: "json",
        uniqueId: 'id',                        
        striped: false,                         
        cache: false, 
        sortName: 'id',
        sortable: true,
        sortOrder: 'desc',
        sidePagination: "server",
        undefinedText: '--',
        singleSelect: true,
        //showRefresh   : true,
        //showColumns   : true,
        toolbar: '#group-table-toolbar',
        search: true,
        strictSearch: true,
        clickToSelect: true,
        pagination: true,
        pageNumber:1,
        pageSize:10,
        pageList: [5, 10, 20, 50, 100],
        paginationPreText:"上一页",
        paginationNextText:"下一页",
        //showToggle: true,
        //cardView: false,
        //detailView: false,
        //showPaginationSwitch: true,
        queryParamsType : "",
        queryParams : function (params) {
            var temp = {
                'pageSize' : params.pageSize,
                'pageNumber' : params.pageNumber,
                'searchText': params.searchText,
                'sortName': params.sortName,
                'sortOrder': params.sortOrder,
            };
            return temp;
        },
        columns: [
                  {
                     checkbox: true
                  },{
                     field: 'name',
                     title:'名称',
                      '16%',
                     sortable : true
                  },{
                     field: 'create_time',
                     title:'创建时间',
                     sortable : true,
                      200
                  },{
                     field: 'description',
                     title:'描述'
                  }
        ],
        onLoadSuccess: function () {
            //alert('表格加载成功!');
        },
        onLoadError: function () {
            //showTips("数据加载失败!");
        },
        onClickRow: function (row, $element) {
            var id = row.id;
            //EditViewById(id, 'view');
            //console.log(row);
        },
        onCheck: function (row, $element) {
            chosenGroupId = row.id;
            $userTable.bootstrapTable("refresh");
            //EditViewById(id, 'view');
        },
        onUncheck: function (row, $element) {
            chosenGroupId = "";
            $userTable.bootstrapTable("removeAll");
            $userTable.bootstrapTable("refresh");
            //EditViewById(id, 'view');
        }
    });
    

     要设置排序的字段加上属性“sortable : true”。

    queryParams : function (params) {
            var temp = {
                'pageSize' : params.pageSize,
                'pageNumber' : params.pageNumber,
                'searchText': params.searchText,
                'sortName': params.sortName,
                'sortOrder': params.sortOrder,
            };
            return temp;
    }

    中加上属性:

    'sortName': params.sortName,
    'sortOrder': params.sortOrder
  • 相关阅读:
    HTML5画图板PhoneGap移植
    简易WCF负载均衡方案
    坑爹的“类型初始值设定项引发异常”
    关于for循环中变量定义的位置
    有道云笔记open api sdk for .net α版
    SL/WPF仿WIN8进度条
    HTML5做个画图板
    Google搜索命令“site:”运算符高级使用技巧:
    ubuntu系统托盘不显示ibus输入法图标(语言栏输入法)的解决方法:
    DOS中如何删除文件夹~
  • 原文地址:https://www.cnblogs.com/samve/p/14198982.html
Copyright © 2011-2022 走看看