Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to pass request body data in type POST using Datatable for Serverside pagination using Javascript

I am trying to implement ServerSide pagination using Datatable for AJAX POST request

here is my Javascript Code, if I use JSON.stringify for data field then api won't hit

$('#tripboard_table').DataTable({
    proccessing: true,
    serverSide: true,
    ajax: {
        "url": "http://localhost:5000/api/v1/trip/get-trip-list",
        "contentType": "application/json; charset=utf-8",
        "type": "POST",
        "dataType": "json",
        "data": {
            "driver_id": "",
            "franchise_id": login_data.franchise_id,
            "page_no": 0,
            "page_size": 10
        }
    },
    columns: [
        { "data": "" },
        { "data": "reference_number" },
        { "data": "consignor_name" },
        { "data": "consignee_name" },
        { "data": "from_city" },
        { "data": "to_city" },
        { "data": "status" },
        { "data": "route_name" },
        { "data": "vehicle_number" },
        { "data": "driver_name" },
        { "data": "pickup_date" },
        { "data": "scheduled_delivery_date" },
        { "data": "total_money_allocated" },
        { "data": "total_money_released" }
    ]



});

if we remove JSON.stringify function from data and passed data as it is then api gets hit and showing error alert that

DataTables warning: table id=tripboard_table - Ajax error. For more information about this error, please see http://datatables.net/tn/7

and no data is inserted in table. In console it shows

Method Not Allowed The method is not allowed for the requested URL.

Please suggest solution for this..

like image 491
Durgesh Ugale Avatar asked Feb 17 '26 00:02

Durgesh Ugale


1 Answers

Use this for adding to existing request of data table

function (d) {
                d.driver_id = "";
                d.franchise_id = login_data.franchise_id;
                d.page_no = 0;
                d.page_size = 10;
                return d;
            }

https://datatables.net/manual/server-side#Sent-parameters

$('#tripboard_table').DataTable({
        proccessing: true,
        serverSide: true,
        ajax: {
            "url": "http://localhost:5000/api/v1/trip/get-trip-list",
            "contentType": "application/json; charset=utf-8",
            "type": "POST",
            "dataType": "json",
            "data": function (d) {
                d.driver_id = "";
                d.franchise_id = login_data.franchise_id;
                d.page_no = 0;
                d.page_size = 10;
                return JSON.stringify(d)
                });
            }
        },
        columns: [
            { "data": "" },
            { "data": "reference_number" },
            { "data": "consignor_name" },
            { "data": "consignee_name" },
            { "data": "from_city" },
            { "data": "to_city" },
            { "data": "status" },
            { "data": "route_name" },
            { "data": "vehicle_number" },
            { "data": "driver_name" },
            { "data": "pickup_date" },
            { "data": "scheduled_delivery_date" },
            { "data": "total_money_allocated" },
            { "data": "total_money_released" }
        ]
    
    

    });
like image 59
Prashanth Reddy Avatar answered Feb 18 '26 19:02

Prashanth Reddy



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!