Server side passing parameters

Server side passing parameters

kali83kali83 Posts: 18Questions: 0Answers: 0

Hi,
i would need to pass 15 parameters to a php api.

But in the examples i don't see how it is done.

Example of ajax call in jquery:

$(document).ready(function() {
$("form#form1").submit(function(){

    var var1= $('input#val1').val();
    var var2 = $('input#val2').val();

           $.ajax({
                type: "POST",
                url: "api.php",
                data:   {"va1": var1, "var2": var2},
                dataType: "html",
                contentType: 'application/x-www-form-urlencoded',
                timeout: 3000

   success: function(response) {
                        $("div#response").html(response);
                },

   error: function(){
                    alert("Call failed...");
                }
            });

  });
});

How do i send the data?

Thank you

Replies

  • kthorngrenkthorngren Posts: 21,341Questions: 26Answers: 4,954

    Take a look at the examples in the ajax.data docs. You will want to create a function to allow for sending updated data.

    Kevin

  • kali83kali83 Posts: 18Questions: 0Answers: 0

    So... i can make a call even when changing a selectbox!

  • kali83kali83 Posts: 18Questions: 0Answers: 0

    So i have to create a json file in the server and with an echo return javascript datatable with url name.json and the table header.

    Quite right?

    Thank you!

  • allanallan Posts: 63,518Questions: 1Answers: 10,473 Site admin

    I'm not actually fully understanding your initial question I'm afraid. There isn't anything in the code there that relates to DataTables. It is a jQuery Ajax call that submits a form. Are you wanting to use those parameters in the Ajax fetch that DataTables is making? In which case, Kevin is spot on - use ajax.data.

    But it isn't clear to me that is actually what you are trying to do here. Perhaps you could explain what your objective is?

    Allan

  • kali83kali83 Posts: 18Questions: 0Answers: 0

    Of the examples i see, i must first create a json file, then run a js file and in the html i must always have the table header structure.

    I should load at each change of a selectbox the data that are in a db and display them to the user.

    is it possible and do it without going to create the json file? I return a json from php. At the end of the API i execute an "echo json_encode $table", without creating a json file on the server.

    I hope, i have explained myself

    Thank you!

  • allanallan Posts: 63,518Questions: 1Answers: 10,473 Site admin

    I return a json from php

    Sure - just do that. DataTables' doesn't "care" if the original source is a static file or a PHP script - as long as it gets JSON in return.

    Allan

  • kali83kali83 Posts: 18Questions: 0Answers: 0

    I could write like that:

    $(document).ready(function() {
    $('form#form1').change(function(){
    var var1 = $('input#var1').val();
    var var2 = $('input#var2').val();

        $.ajax({
            type: "POST",
            url: "api.php",
            data: {"var1": var1, "var2": var2},
            dataType: "html",
            async: true,
            contentType: 'application/x-www-form-urlencoded',            
            timeout: 3000,
            success: function(response){
                $('#table').DataTable( {
                    "processing": true, 
                    "serverSide": true,
                    "ajax": {
                        "url": response,
                    },
                    "columns":  [
                    {
                        "className":      "details-control",
                        "orderable":      false,
                        "data":           null,
                        "defaultContent": ""
                    },
    
                    { "data": "name" },
                    { "data": "age" },
    
                ],
                "order": [[1, "asc"]]
                } );
    
                $("#tablesa tbody").on("click", "td.details-control", function () {
                    var tr = $(this).closest("tr");
                    var row = table.row( tr );
    
                    if ( row.child.isShown() ) {
                        row.child.hide();
                        tr.removeClass("shown");
                    }
                    else {
                        row.child( format(row.data()) ).show();
                        tr.addClass("shown");
                    }
                } );                    
            },
            error: function(){
                alert('Call failed...');
            }  
        });
    } );    
    

    } );

    :p

    Thank you!

  • kali83kali83 Posts: 18Questions: 0Answers: 0
    edited October 2020

    $json = json_encode($tabDTSA);

    $javaScript = '
    <script src="../js/table.sa.js"></script>
    <script src="../js/dt.fixedheader.mini.js"></script>
    <script>
    $(document).ready(function() {
    var table = $("#tablesa").DataTable( {
    fixedHeader: true,
    "ajax": '.$json.',
    "contentType": "application/json",
    "columns": [
    {
    "className": "details-control",
    "orderable": false,
    "data": null,
    "defaultContent": ""
    },

            { "data": "data1" },
            { "data": "data2" },
            { "data": "data3" },
            { "data": "data4" },
            { "data": "data5" },
            { "data": "data6" },
            { "data": "data7" },
            { "data": "data8" },
            { "data": "data9" },
            { "data": "data10" },
            { "data": "data11" },
            { "data": "data12" },
            { "data": "data13" },
            { "data": "data14" },
            { "data": "data15" }
    
        ],
        "order": [[3, "asc"]]
    } );
    
    $("#tablesa tbody").on("click", "td.details-control", function () {
        var tr = $(this).closest("tr");
        var row = table.row( tr );
    
        if ( row.child.isShown() ) {
            row.child.hide();
            tr.removeClass("shown");
        }
        else {
            row.child( format(row.data()) ).show();
            tr.addClass("shown");
        }
    } );
    

    } );</script>';

    echo '

    ' . '' . '' . '' . '
    data1data1.data1data1data1data1.data1data1data1data1data1data1data1data1data1

    '
    .$javaScript;

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

    This error from chrome developer tool:
    http://localhost/DataTable/test/?0%5B...........................(%22%23ckall_10595832870875f96c263c8343%22).click(function()%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%24(%22input%5Bname%3Dck_10595832870875f96c263c8343%22).prop(%22checked%22%2C%20%24(this).prop(%22checked%22))%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D)%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%24(%22input%5Bname%3Dck_10595832870875f96c263c8343%22).click(function()%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(!%24(this).prop(%22checked%22))%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%24(%22%23selectAll%22).prop(%22checked%22%2C%20false)%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D)%3B%3C%2Fscript%3E&_=1603715322108 414 (Request-URI Too Long)

    The data I am going to return are many.

    Is it possible that it fails to process because the string is too long?

    Thank you!

  • kthorngrenkthorngren Posts: 21,341Questions: 26Answers: 4,954

    Change the Ajax request to type POST so the parameters are sent in the payload and not on the URL.

    Kevin

  • kali83kali83 Posts: 18Questions: 0Answers: 0

    I modified:
    "ajax": {
    "url": "'.$pathJson.'",
    "type": "POST"
    },

    But i get the error: 405 not allowed nginx

    If i insert the string json in the url it returns me not found.

    if i insert the path of the json file it works but without "type": "POST"

    Sorry... you could give me an example please!

    Thank you!

  • kthorngrenkthorngren Posts: 21,341Questions: 26Answers: 4,954

    Thats a server error outside of Datatables. Maybe this SO thread will help.

    Kevin

  • kali83kali83 Posts: 18Questions: 0Answers: 0
    edited October 2020

    I love you.... :D it works...

    I have to understand how i can don't create the json file but directly from the decoded string.

    if I write the string in the url json it returns jq.mini.js: 1 POST http://localhosta/ test /[object% 20Object] 404 (Not Found)

    If i insert the object in the url it works.

    For now it's okay...

    Then as soon as i have some time i will return....

    Thank you!

This discussion has been closed.