Bootstrap Tabe接收对象参数_bootstraptable requestparam-CSDN博客

本文介绍如何在SpringMVC框架中使用BootstrapTable插件实现动态数据展示及查询功能，详细解释了如何通过前端传递参数到后端，并正确解析这些参数。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

当我们做查询的时候，经常是以一个对象作为接受参数
例如：

    @RequestMapping(value = "/hr/organization/query")
    @ResponseBody
    public ResponseData query(Organization organization, HttpServletRequest request, @RequestParam(defaultValue = DEFAULT_PAGE_NUMBER) int pageNumber,
                              @RequestParam(defaultValue = DEFAULT_PAGE_SIZE) int pageSize) {
        return new ResponseData(service.query(organization, pageNumber, pageSize));
    }

此处接收对象Organization为参数。

Bootstrap Table的接受参数的查询函数中只要存在字段名称同对象中的字段名称，Spring MVC即可接收。
例如：
Organization 存在字段 organizationCode，在只需要查询函数中存在字段 organizationCode 即可，而不是 organization.organizationCode;

例子：

var $table = $('#table').bootstrapTable({
            url: '/hr/organization/query',
            height: $WIN.height()-50,
            method: 'post',
            search: true,
            locale: 'zh-CN',
            pagination: true,
            sidePagination: 'server', // client or server
            pageList: [10, 25, 50, 100],
            showColumns: true,
            showRefresh: true,
            sortable: true,
            contentType: 'application/x-www-form-urlencoded',
            queryParams: queryParams,
            toolbar: '#toolbar-btn',
            showExport: true,                     //是否显示导出
            exportDataType: "basic",              //basic', 'all', 'selected'.
            columns: [{
                field: 'state',
                checkbox: true,
            }, {
                field: 'organizationCode',
                title: '<@spring.message "hr.organization_code"/>',
                sortable: true,
                width: 100,
                editable: true
            }, {
                field: 'organizationName',
                title: '<@spring.message "hr.organization_name"/>',
                width: 200,
                editable: true
            }, {
                field: 'startActiveDate',
                title: '<@spring.message "fnd.start_active_date"/>',
                width: 120,
            }, {
                field: 'endActiveDate',
                title: '<@spring.message "fnd.end_active_date"/>',
                width: 120,
                format: 'yyyy-mm-dd',
                formatter: function (endDate) {
                    if (typeof  endDate == 'string') {

                        var temp = endDate;
                        var fullDate = temp.split("-");

                        return new Date(fullDate[0], fullDate[1] - 1, fullDate[2], 0, 0, 0);
                    } else {
                        return endDate;
                    }
                },
                editable:
                    {
                        title: '<@spring.message "fnd.end_active_date"/>',
                        type:
                            'date',
                        clear:
                            false,
                        placement:
                            'left',
                    }
            }
            ],
            onEditableSave: function (field, row, oldValue, $el) {
                row.state = true;
            }
            ,
        })
    ;

    function queryParams(params) {
        var organizationCode = params.search;
        if (organizationCode == "") {
            var param = {   //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
                pageSize: params.limit,   //页面大小
                pageNumber: params.offset  //页码
            };
        } else {
            var param = {   //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
                organizationCode: organizationCode,//此处只要定义对象中的字段即可自动识别
                pageSize: params.limit,   //页面大小
                pageNumber: params.offset  //页码
            };
        }
        //console.log(JSON.stringify(param));

        return param;
    }