Problem with Sending Serialized Data via Ajax Post Request - Data table

Problem with Sending Serialized Data via Ajax Post Request - Data table

hey_danishhey_danish Posts: 6Questions: 2Answers: 0

Data Is sending accurately via other Ajax Call, But while sending the data via Datatable Post request, It is getting malformed. Below is the code that I'm using.

    "ajax": {
  "url":r_url,
  "type":r_type,
      "data": r_filters,
      "beforeSend": function(request) {
    request.setRequestHeader("X-CSRFToken", getCookie("csrftoken") );
  },
 "dataSrc":'data',
    },
"dom":"Bfrtip",
"bProcessing":true,
"bServerSide":true,
"bDestroy":true,
"columns":r_columns,
"aoColumnDefs": r_markups
  });

Trying to send this serialize data (f_cms=2&f_cms=1&f_=FALSE&f_daterange=2019-03-08%20-%202019-03-08&filter=true) but It is sending like (f,_,c,m,s,=,2, ...)
More details are here - https://stackoverflow.com/questions/55063246/serialize-form-data-in-datatable-jquery-ajax-post

Please help to sort this out.

Answers

  • kthorngrenkthorngren Posts: 20,139Questions: 26Answers: 4,734

    You haven't posted much information to go on. I would suggest using console.log to output debugs at various places to see how your data is handled. In the SO thread you have this function:

    $('#qc_list_filter').submit(function(e){
        e.preventDefault();
        var serializeData =$('#qc_list_filter').serialize()
        initializeDatatable( r_columns, serializeData );
      });
    

    What does the function initializeDatatable do with serializeData?

    Maybe you can post a link to your page or a test case so we can help debug.
    https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

    Kevin

  • hey_danishhey_danish Posts: 6Questions: 2Answers: 0
       // Function to Initialize DataTable
       function initializeDatatable( r_columns, r_filters ) {
         var markups = [{
          "mRender": function( data, type, row ){     },"aTargets":[1] ,
         }], resp = createDataTable("#tbl_qc", r_columns, r_filters );
         resp.create( "/qc/list", "POST", markups );
         resp.action()
       }
    
    //Generic Factory Function To Process DataTable
    var createDataTable = function ( targetID, r_columns, r_filters ) {
      var response =  {
        targetID,
        r_columns,
        r_filters,
        update: function( obj, param, tableID, postUpdateAction ) {    },
        create: function( r_url, r_type, r_markups ){
          $(targetID).DataTable({
            "ajax": {
          "url":r_url,
          "type":r_type,
              "data": r_filters,
              "beforeSend": function(request) {
            request.setRequestHeader("X-CSRFToken", getCookie("csrftoken") );
          },
         "dataSrc":'data',
            },
        "dom":"Bfrtip",
        "bProcessing":true,
        "bServerSide":true,
        "bDestroy":true,
        "columns":r_columns,
        "aoColumnDefs": r_markups,
            "fnRowCallback": function( nRow, aData, iDisplayIndex, iDisplayIndexFull ) {
              var j = 0;
          for ( var i = 0; i < aData.length; i++ ) {
                var pkeyValue = aData[0], string="",
                    className = r_columns[i][r_columns[i]["title"]][0],
                    cType = r_columns[i][r_columns[i]["title"]][1],
                    fieldId = r_columns[i][r_columns[i]["title"]][2]+"_"+pkeyValue;
            if( className.trim() == "editable" ) {
            if (cType == "checkbox") {
              string = response.inlineAppender( aData[i], cType, fieldId)
            } else {
                      string = "<span>"+aData[i]+"</span>"+" "+ response.inlineAppender( aData[i], cType, fieldId);
            }
                $('td:eq('+i+')', nRow).html( string ).addClass( className );
                }
          }
            }
          });
        },
        inlineAppender: function(td_value, cType, fieldId) {  },
        action: function() { },
      }
      return response;
    };
    
  • hey_danishhey_danish Posts: 6Questions: 2Answers: 0

    I solved the problem,

    Line No: 22, It works after I changed
    "data": r_filters
    to
    "data": {"extra_data":r_filters}

    Wrapped in JSON Data.

This discussion has been closed.