Load data in datatable from ajax through button click

Load data in datatable from ajax through button click

tjahidtjahid Posts: 4Questions: 1Answers: 0

Hi, I want to populate data in a datatable through a button click event. My code looks like :

$("#customerTable").dataTable({
"ajax": {
url: "customer/LoadCustomers",
dataType: "json",
data: { searchText: searchText },
dataSrc: ""
}
});

I want to load the table without any data on (document).ready(function () {}); . With a button click i want to populate the table created above:

$("#customerSearchButton").on("click", function (event) {

//populate the table with data (available in url: "customer/LoadCustomers",)
});

Answers

  • tjahidtjahid Posts: 4Questions: 1Answers: 0

    Solved !!!

    My table looks like this :

    Table = $("#customerTable").DataTable({
    data:[],
    columns: [
    { "data": "CompanyId" },
    { "data": "CompanyName" },
    { "data": "City" },
    { "data": "Country" }
    ],
    rowCallback: function (row, data) {},
    filter: false,
    info: false,
    ordering: false,
    processing: true,
    retrieve: true
    });

    Button Click handler:

    $("#customerSearchButton").on("click", function (event) {
    $.ajax({
    url: "",
    type: "post",
    data: { searchText: searchText }
    }).done(function (result) {
    Table.clear().draw();
    Table.rows.add(result).draw();
    }).fail(function (jqXHR, textStatus, errorThrown) {
    // needs to implement if it fails
    });
    }

This discussion has been closed.