Passing filters to the API

[Jaxelr]

Is there a way to pass parameters to the HTML.BootstrapTable definition as based on the API? Could some examples be added to the Web example?

[Jaxelr]

For those who might need to look into this search the way to invoke the html.bootstrap table with params is the following

            @(Html.BootstrapTable(Url.Action("GetData"), TablePaginationOption.server, htmlAttributes: new { @id = "TableId" })
                .Apply(TableOption.queryParams, "queryParams")
                .Columns("Field1", "Field2", "FieldN")
            )

Where the queryParams is your javascript function that will collect the params from the html attributes you might need

function queryParams(params) {
    params.filter1 = $inputField.val();
    params.filter2 = $inputField2.val();
    params.filter3 = $inputField3.val();
    return params;
}

and this will be picked up on your controller

  //offset and limit are just for pagination server side
  public JsonResult GetInsurerData(string filter, string filter2, string filter3, int offset, int limit)
        {
            /*do your service call or repo call etc....
           var response = _repo.RetrieveData(filter1, filter2, filter3, offset, limit);
           */

            //return the json with an object with rows and total records for the paging.
            return Json(new
            {
                rows = response.rows,
                total = response.Item2.TotalRecords
            }, JsonRequestBehavior.AllowGet);
        }

For obvious reasons this will probably be picked up using ajax calls so consider using something like this

//using jquery sample, will probably be better for performance to use some smaller library like Axios.
$btnClick.on("click", function () {
            $table.bootstrapTable('showLoading');
            $.ajax({
                url: $searchUrl,
                data: { filter1: $inputField1.val(), filter2: $inputField2.val(), filter3: $inputField3.val(), limit: $limit, offset: $offset },
                dataType: 'json',
                type: 'POST',
                success: function (data) {
                    $table.bootstrapTable('hideLoading');
                    $table.bootstrapTable('load', data);
                },
                error: function (e) {
                    console.log(e.responseText);
                }
            });
        }
    });