bootstrap table一直发送http请求

Question

在维护项目时发现，在查询条件提交后，之前维护过的bootstrap-table一直发送http请求，因为之前后端分页的原因，改写过bootstrap-table,不是很理解这个bug

<section class="content">
            <!-- 查询条件-->
            <div class="panel panel-default">
                <div class="panel-body">
                    <form id="searchForm" class="form-inline"  method="post" onsubmit="return false;">
                        <input type="hidden" name="action" value="all" />
                        <input type="hidden" value="<?php echo date('Y-m-d', strtotime("-6 day")) ?>" name="begin_date"
                               id="begin_date"/>
                        <input type="hidden" value="<?php echo date('Y-m-d'); ?>" name="finish_date" id="finish_date"/>

                        <div class="form-group">
                            <label>游戏名称:</label>
                            <select name="game_id" id="game_id" class="form-control input-sm">
                                <option value="">选择游戏</option>
                                <?php foreach ($games as $game) { ?>
                                    <option value="<?php echo $game['game_id']; ?>" <?php echo isset($row["game_id"]) && $game['game_id'] == $row["game_id"] ? 'selected' : ''; ?>><?php echo $game['game_name']; ?></option>
                                <?php } ?>
                            </select>
                        </div>

                        <div class="input-group">
                            <div class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></div>
                            <input style="width:300px" class="form-control lg" id="daterangepicker" name="daterangepicker">
                        </div>

                         <div class="input-group">
                            <button type="submit" id="submit" class="btn btn-default btn-sm">
                                <i class="glyphicon glyphicon-search"></i>
                            </button>
                        </div>

                        <div class="input-group">
                            <button  id="refresh" class="btn btn-default btn-sm">
                                <i class="glyphicon glyphicon-refresh"></i>
                            </button>
                        </div>

                        <div class="form-group pull-right">
                            <label>每页:</label>
                            <select name="page_size" id="page_size" class="form-control">
                                <option value="">请选择页数</option>
                                <?php echo $this->util->pageOption($this->util->pageMaps)?>
                            </select>
                        </div>
                    </form>

                </div>

            </div>

            <div class="view" style="margin-top:20px">
                <div>
                    <!-- Nav tabs -->
                    <ul class="nav nav-tabs tab_list" role="tab_list" >
                        <li role="presentation" class="active"><a href="#all" aria-controls="all" role="tab"
                                                                  data-toggle="tab">总数据</a></li>
                        <li role="presentation"><a href="#google_play" aria-controls="google_play" role="tab"
                                                   data-toggle="tab">GooglePlay</a></li>
                        <li role="presentation"><a href="#apple_store" aria-controls="apple_store" role="tab"
                                                   data-toggle="tab">AppleStore</a></li>
                    </ul>

                    <!-- Tab panes -->
                    <div class="tab-content">
                        <div role="tabpanel" class="tab-pane active" id="all">
                            <table width="100%" class='table table-striped table-hover table-responsive table-bordered table-responsive'
                                   data-pagination='true' id='all_list' data-show-columns='true'>
                            </table>
                        </div>
                        <div role="tabpanel" class="tab-pane" id="google_play">
                            <table width="100%" class='table table-striped table-hover table-responsive table-bordered table-responsive'
                                   data-pagination='true' id='google_play_list' data-show-columns='true'>
                            </table>
                        </div>
                        <div role="tabpanel" class="tab-pane" id="apple_store">
                            <table width="100%" class='table table-striped table-hover table-responsive table-bordered table-responsive'
                                   data-pagination='true' id='apple_store_list' data-show-columns='true'>
                            </table>
                        </div>
                    </div>

                </div>
            </div>

            <div id="pager">

            </div>

        </section>
        <!-- /.content -->
    </aside>

    <script>
        $('#daterangepicker').daterangepicker(
            {
                startDate: moment().subtract('days', 6),
                endDate: moment(),
                dateLimit: {
                    "days": 360
                }, //起止时间的最大间隔
                showWeekNumbers: true, //是否显示第几周
                ranges: {
                    ///'最近1小时': [moment().subtract('hours',1), moment()],
                    '今日': [moment().startOf('day'), moment()],
                    '昨日': [moment().subtract('days', 1).startOf('day'), moment().subtract('days', 1).endOf('day')],
                    '最近7日': [moment().subtract('days', 6), moment()],
                    '最近30日': [moment().subtract('days', 29), moment()],
                    '本月': [moment().startOf("month"), moment().endOf("month")],
                    '上个月': [moment().subtract(1, "month").startOf("month"), moment().subtract(1, "month").endOf("month")]
                },
                "linkedCalendars": false,
                "parentEl": "body",
                opens: 'right', //日期选择框的弹出位置
                buttonClasses: ['btn btn-default'],
                applyClass: 'btn-small btn-primary blue',
                cancelClass: 'btn-small',
                locale: {
                    format: 'YYYY-MM-DD',
                    applyLabel: '确定',
                    cancelLabel: '取消',
                    fromLabel: '起始时间',
                    toLabel: '结束时间',
                    separator: ' ~ ',
                    customRangeLabel: '自选日期',
                    daysOfWeek: ['日', '一', '二', '三', '四', '五', '六'],
                    monthNames: ['一月', '二月', '三月', '四月', '五月', '六月',
                        '七月', '八月', '九月', '十月', '十一月', '十二月'],
                    firstDay: 1
                }
            }, function (start, end, label) {//格式化日期显示框

                $('#daterangepicker').html(start.format('YYYY-MM-DD') + ' - ' + end.format('YYYY-MM-DD'));

                //赋值给隐藏输入框
                var begin_date = new Date($("input[name='daterangepicker_start']").val());
                var begin_date_str = begin_date.getFullYear() + '-' + (begin_date.getMonth() + 1) + '-' + begin_date.getDate();

                var finish_date = new Date($("input[name='daterangepicker_end']").val());
                var finish_date_str = finish_date.getFullYear() + '-' + (finish_date.getMonth() + 1 ) + '-' + finish_date.getDate();

                $('#begin_date').val(begin_date_str);

                $('#finish_date').val(finish_date_str);

            });
    </script>

    <script type="text/javascript">
        var pageNum = <?php echo isset($page_num) ? $page_num : 1?>;
        var pageSize = <?php echo isset($page_size) ? $page_size : 15?>;
        var orderBy = "<?php echo isset($order_by) ? $order_by : ''?>";

        var tb = new CustomTable();
        $(function(){
            $("[name='action']").val('all');
            listGame(1);
        });
        $('#submit').on('click',function(){
            var type = $("[name='action']").val();
            listGame(1,type);
        });
        $('.tab_list li').on('click',function(){
            var type = $(this).children().eq(0).attr('aria-controls');
           $("[name='action']").val(type);
            listGame(1);
        });

        function listGame(pageNumber) {
            var type = $("[name='action']").val();
            var columns = [{
                field: 'log_date', title: '日期', width: 40
            },{
                field: 'game_name', title: '游戏名称', width: 40,sortable:false
            }, {
                field: 'server_id', title: '服务器ID', width: 40,sortable:false
            }, {
                field: 'server_name', title: '服务器名称', width: 40,sortable:false
            },{
                field: 'dnu', title: '注册', width: 40,sortable:false
            }, {
                field: 'apa_rechargeAmount', title: '收入', width: 40
                ,formatter: function (value, row, index) {
                return value + '美元';
            }
            }];
            var options = {};
            options.pageSize = pageSize;
            options.pageNumber = pageNum;
            options.orderBy = orderBy;
            // options.pageSize= 10;
            // options.sidePagination = 'client';
            // options.pagination = true;

            options.formId = 'searchForm';
            tb.destroy();
            tb.init('/oversea/statistic/everyServer', options, columns, type + '_list');
            console.log(type)
        }

        $('#page_size').change(function(){
            $('#submit').click();
        });
    </script>

var CustomTable = function () {
    tableId = '';
    url = '';
};
CustomTable.prototype.init = function (uri, options, columns, el_id) {
    tableId = el_id;
    url = uri;
    if (columns && columns.length > 0) {
        for (var i = 0; i < columns.length; i++) {
            if (columns[i].field) {
                columns[i].field == '';
            }
            if (!columns[i].title && columns[i].field) {
                columns[i].title = columns[i].field;
            } else if (!columns[i].title) {
                columns[i].title = '';
            }
            if (!columns[i].width) {
                columns[i].width = 10;
            }
            if (!columns[i].align) {
                columns[i].align = 'center';
            }
            if (!columns[i].valign) {
                columns[i].valign = 'middle';
            }
            if (isEmpty(columns[i].sortable)) {
                columns[i].sortable = true;
            }
        }
    }
    if(isEmpty(options.pageNumber) && isZero(options.pageNumber)){
        options.pageSize = 1;
    }
    if(isEmpty(options.pageSize) && isZero(options.pageSize)){
        options.pageSize = 10;
    }
    var fromParam;
    if (options.formId) {
        fromParam = parseQueryString($('#searchForm').serialize());
        if (!isEmpty(fromParam['page_size'])) {
            options.pageSize = fromParam['page_size'];
        }
    }
    $('#' + el_id).bootstrapTable({
        url: url + "?_=" + Math.random(),
        method: options.method || 'post',
        toolbar: options.toolbar || '#toolbar',
        striped: isEmpty(options.striped) ? true : options.striped,
        //cache: options.cache || false,
        pagination: isEmpty(options.pagination) ? true : options.pagination,
        sortable: isEmpty(options.sort) ? true : options.sort,
        sortOrder: options.order || 'asc',
        resetView: true,
        queryParams: options.queryParams || function (params) {
            var param = {};
            if (!isEmpty(fromParam)) {
                param = fromParam;
            }
            param['page_num'] = (params.offset / params.limit) + 1;
            param['page_size'] = params.limit;
            if(!isEmpty(params.sort) && !isEmpty(params.order)){
                param['order_by'] = params.sort + ' ' +params.order;
            }
            else{
                param['order_by'] = options.orderBy;
            }
            return param;
        },
        contentType: options.contentType || 'application/x-www-form-urlencoded',
        sidePagination: options.sidePagination || 'server', // client
        pageNumber: options.pageNumber,
        pageSize: options.pageSize,
        pageList: options.pageList || [10, 15, 20, 30, 80,100],
        search: options.search,// 默认不显示搜索框
        strictSearch: true,
        showColumns: options.showColumns || false, // 默认不显示下拉框(选择显示的列)
        showRefresh: options.showRefresh || false,//默认不显示刷新按钮
        minimunCountColumns: options.minCols || 1, // 最少允许的列
        //   clickToSelect : false, // 禁止点击选中
        uniqueId: "id",
        showHeader: true,
        showToggle: options.showToggle || false, // 是否显示详细视图和列表视图的切换按钮
        cardView: options.cardView || false, // 是否显示详细视图
        detailView: options.detailView,// 是否显示详细视图
        //   hideColumn : (!options.hideColumn ? "id" : options.hideColumn),
        showExport: options.showExport || false,
        // rowStyle : options.rowStyle || function(row, index) {
        //     if (index % 2 === 0) {
        //         return {
        //             classes : 'active'
        //         };
        //     }
        //     return {};
        // },
        exportDataType: options.exportDataType || 'basic',
        columns: columns || [{
            field: 'id',
            title: 'id'
        }],
        onLoadSuccess: options.onLoadSuccess || function (data) {
        },
        onExpandRow: function (index, row, $detail) {
            group(index, row, $detail);
        }
    });
};


CustomTable.prototype.onExpandRow = function (index, row, $detail) {
    group(index, row, $detail);
};

CustomTable.prototype.refresh = function () {
    $('#' + tableId).bootstrapTable("refresh", {
        url: url
    });
};

CustomTable.prototype.refreshPage = function (pageNum) {
    $('#' + tableId).bootstrapTable("refreshOptions", {
        pageNum: pageNum
    });
};

CustomTable.prototype.getSelections = function () {
    var ids = new Array();
    $.each($('#' + tableId).bootstrapTable("getSelections"), function (i, row) {
        ids.push(row.id);
    });
    return ids;
};

CustomTable.prototype.destroy = function () {
    $('#' + tableId).bootstrapTable('destroy');
};

一直初始化bootstrap-table, 不明白是哪一步的错。

Answer 1

现在每个涉及到调用初始化的地方前面打个log先定位问题

Answer 2

那指定是有循环的地方出问题了呗

你这里each循环执行了请求方法