Pass Parameters through ajax call – ajax url

I am trying to pass value parameter through the ajax call to the controller. It is a date value. I am struggling to find a way to pass parameters through this ajax url. Please help.

 function dataTable() {
    var value = $("#somedatevalue).val();
    $("#thisTable").DataTable({
        "processing": true,
        "paging": false,

        "language": {
            processing: "<span class='processing-message'><i class='fa fa-circle-o-notch fa-spin'></i> Processing...</span>"
        },
        
        ajax: {

            url: $('table#thisTable').data("ajaxurl"),
            type: "POST",
            datatype: "json",

        },
        "columns": [
            {
                "data": "column1",
            },
            {
                "data": "column2",
            },
            {
                "data": "column3",
            },
            {
                "data": "column4",
            },
            {
                "data": "column5",
            },
            {
                "data": "Url",
                "render": function (data) {
                    return '<a class="btn btn-info" href="' + data + '">Select</a>';
                }
            }
        ],
        "dom": 't<"col-lg-3"l><"col-lg-6"p><"col-lg-3"i>'
    });
}  

2 thoughts on “Pass Parameters through ajax call – ajax url”

  1. You can pass value as query parameter like http://www.url.com?date="17-02-21"

    If you are using php use can get the value as $_GET['date']
    If you are using node js, you can get value as req.query.date

    Reply
  2. Consider the following.

    function dataTable() {
      var value = $("#somedatevalue").val();
      $("#thisTable").DataTable({
        "processing": true,
        "paging": false,
        "language": {
            processing: "<span class='processing-message'><i class='fa fa-circle-o-notch fa-spin'></i> Processing...</span>"
        },
        "ajax": {
          "url": $('table#thisTable').data("ajaxurl"),
          "type": "POST",
          "data": { "myValue": value },
          "datatype": "json"
        },
        "columns": [
          {
            "data": "column1",
          },
          {
            "data": "column2",
          },
          {
            "data": "column3",
          },
          {
            "data": "column4",
          },
          {
            "data": "column5",
          },
          {
            "data": "Url",
            "render": function (data) {
              return '<a class="btn btn-info" href="' + data + '">Select</a>';
            }
          }
        ],
        "dom": 't<"col-lg-3"l><"col-lg-6"p><"col-lg-3"i>'
      });
    }
    

    First you must address the Typo in your jQuery Selector. Then you can adjust your Ajax parameters to include a data.

    See more here: https://datatables.net/reference/option/ajax.data

    In principle it operates in exactly the same way as jQuery’s $.ajax.data property, in that it can be given as an object with parameters and values to submit, but DataTables extends this by also providing it with the ability to be a function, to allow the data to be re-evaluated upon each Ajax request (see above).

    Reply

Leave a Comment