账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    bootstrap table插件分页传递给后台的参数接收问题
    64
    0

    查询出结果后,选择第二页时,页面数据又变回原来未查询的数据了,
    也就是说打开第二页的时候没有带上查询的参数。
    这是bootstrap-table的初始化函数

    //查询栏
    function userquery(){
        var data=$("#formSearch").serialize();
        $.post(
        '/yycgproject/queryUser_result',
        data,
        function(msg){
            //这里必须接收json对象
            //此处判断不能简写为!msg
                
                $('#tb_departments').bootstrapTable('load',msg);
            
        },
        'json'
        );
        
        
    };
    $(function() {
    
        //1.初始化Table
        var oTable = new TableInit();
        oTable.Init();
    
        //2.初始化Button的点击事件
        /* var oButtonInit = new ButtonInit();
        oButtonInit.Init(); */
    
    });
    
    var TableInit = function() {
        var oTableInit = new Object();
        //初始化Table
        oTableInit.Init = function() {
            $('#tb_departments').bootstrapTable({
                url : '/yycgproject/queryUser_result', //请求后台的URL(*)
                method : 'get', //请求方式(*)
                toolbar : '#toolbar', //工具按钮用哪个容器
                striped : true, //是否显示行间隔色
                cache : false, //是否使用缓存,默认为true,所以一般情况下需要设置一下这个属性(*)
                pagination : true, //是否显示分页(*)
                sortable : false, //是否启用排序
                sortOrder : "asc", //排序方式
    
                queryParamsType : '',
                queryParams : oTableInit.queryParams,//传递参数(*)
                sidePagination : "server", //分页方式:client客户端分页,server服务端分页(*)
                pageNumber : 1, //初始化加载第一页,默认第一页
                pageSize : 10, //每页的记录行数(*)
                pageList : [ 10, 25, 50, 100 ], //可供选择的每页的行数(*)
                strictSearch : true,
                clickToSelect : true, //是否启用点击选中行
            /*     height : 550, //行高,如果没有设置height属性,表格自动根据记录条数觉得表格高度 */
                uniqueId : "userid", //每一行的唯一标识,一般为主键列
                cardView : false, //是否显示详细视图
                detailView : false, //是否显示父子表
                columns : [ {
                    field : 'userid',
                    title : '账号'
                }, {
                    field : 'username',
                    title : '名称'
                }, {
                    field : 'groupid',
                    title : '用户类型',
                    formatter : function(value, row, index) {
                        if (value == 1) {
                            return "卫生局";
                        } else if (value == 2) {
                            return "卫生院";
                        } else if (value == 3) {
                            return "卫生室";
                        } else if (value == 4) {
                            return "供货商";
                        } else if (value == 0) {
                            return "管理员";
                        }
                    }
                }, {
                    field : 'sysmc',
                    title : '所属单位'
                }, {
                    field : 'userstate',
                    title : '状态'
                } ]
            });
        };
    
        //得到查询的参数
        oTableInit.queryParams = function(params) {
        
            var temp = { //这里的键的名字和控制器的变量名必须一直,这边改动,控制器也需要改成一样的
                pageSize : params.pageSize, //页面大小
                pageNum : params.pageNumber,//页码
                /* sysuserCustom.groupid:groupid */
                groupid:$('#txt_search_type').val()
            };
            return temp;
        };
        return oTableInit;
    };

    再上面的查询参数设置中,设置了groupid:$('#txt_search_type').val(),让groupid传到后台,但是后台的controller中
    //根据页面的条件查询数据

    @RequestMapping("/queryUser_result")
    @ResponseBody
    public DataGridResultInfo queryByVo(SysuserQueryVo sysuserQueryVo,@RequestParam(defaultValue="10")int pageSize,@RequestParam(defaultValue
            ="1")int pageNum) throws Exception{
        
        
        DataGridResultInfo resultInfo = userService.findSysuserList(sysuserQueryVo, pageSize, pageNum);
        return resultInfo;
    }

    是用 sysuserQueryVo 这个pojo接收了,传过去的参数并无法装配到pojo中,
    希望大佬指教一下,查询后的分页功能是怎么实现的

    2
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 悻諨鉽蕗過 普通会员 1楼

      Bootstrap Table插件本身不直接支持分页传递参数到后台,你需要使用一些前端技术如jQuery或者Vue.js等来实现这个功能。下面是一个使用jQuery实现的例子:

      ```html

      Bootstrap Table Example
      Column 1 Column 2 Column 3
      Row 1, Column 1 Row 1, Column 2 Row 1, Column 3
      Row 2, Column 1 Row 2, Column 2 Row 2, Column 3

      ```

      在这个例子中,我们首先在HTML中创建了一个Bootstrap Table表格,并设置了其样式。然后,我们使用jQuery的DataTable插件来处理表格的数据。在数据处理函数中,我们根据后台API的返回数据,进行了数据的填充。

      注意,这个例子中,我们没有在后台API中提供分页参数,你可能需要根据你的实际需求来修改这个例子。

    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部