Bootstrap-table: customAjaxCallback : Multiple tables, one function

[jy95]

Hello,

I am on an custom ajax implementation for bootstrap-table :

For some reasons, I would like to have multiple bootstrap Tables (let's call them searchTable1 , searchTable2,etc). Each of these table will be set on a custom date range (30 last days, 60 last days,etc).

I would like to pass a parameter (like the table Jquery selector or any data-myCustomDataAttribute parameter) . How can I do that ? (I tried call but bootstrap already call it on the ajaxCallback function).
It will look like stupid to make x functions that are exactly the same except for two fields depending on the table.
Here is my code :

$('#searchTable').bootstrapTable({
        columns: [{
            field: 'product',
            title: 'Produit'
        } , {
            field: 'language',
            title: 'Langue'
        }, {
            field: 'comment',
            title: 'Commentaire'
        }],
        showRefresh: true,
        ajax: provideFeedbacksList,
        cache: false,
        dataField: 'feedbacks',
        totalField: 'total_size',
        search: false,
        sidePagination: 'server',
        pagination: true
    });

The ajax provider :

// I only used this example : http://issues.wenzhixin.net.cn/bootstrap-table/index.html#options/custom-ajax.html
function provideFeedbacksList(params) {
    let tableData = params.data;

    let serverCall = {};

    // add limits and offset provided by bootstrap table
    serverCall["page_offset"] = tableData.offset;
    serverCall["page_size"] = tableData.limit;

   // retrieve the date range for this table :
  // will be easy If something like this was possible : params.jquerySelector.attr("date-range-start")
 // will be easy If something like this was possible : params.jquerySelector.attr("date-range-end")

    let json = JSON.stringify(serverCall);

    $.ajax({
        url: baseUri + "/feedbacks",
        type: "POST",
        dataType: "json",
        contentType: "application/json; charset=utf-8",
        data: json,
        success: function (reponse) {
            params.success(reponse);
        },
        error: function (er) {
            params.error(er);
        }
    });
}

The call stack :

[jy95]

Self solved my issue : has to wrapper the function inside another.

function callbacker(test){
    console.log(test);
    return function (params) {
        console.log(params);
        console.log(test);
        let tableData = params.data;

          let serverCall = {};

        // add limits and offset provided by bootstrap table
        serverCall["page_offset"] = tableData.offset;
        serverCall["page_size"] = tableData.limit;

        let json = JSON.stringify(serverCall);

        $.ajax({
            url: baseUri + "/feedbacks",
            type: "POST",
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            data: json,
            success: function (reponse) {
                params.success(reponse);
            },
            error: function (er) {
                params.error(er);
            }
        });
    }
}

$('#searchTable').bootstrapTable({
        columns: [{
            field: 'product',
            title: 'Produit'
        } , {
            field: 'language',
            title: 'Langue'
        }, {
            field: 'comment',
            title: 'Commentaire'
        }],
        showRefresh: true,
        ajax: callbacker("whatEverValueYouWant"),
        cache: false,
        dataField: 'feedbacks',
        totalField: 'total_size',
        search: false,
        sidePagination: 'server',
        pagination: true
    });

[happytk]

Hi, but what if I want to use this pattern at html with data-attributes? anyone help me please.