Pratik Joshi Pratik Joshi - 1 month ago 9
Javascript Question

loading data in datatable on onchange event

I want to implement function in which data will be loaded into datatable after onChange event. So for that I am trying to implement code as below.

var viewdatatab = $('#dataTablesFeedback').dataTable({

"columns": [

{ "data": "resourceId" },
{ "data": "feedbackRecommendation" },
{ "data": "technicalSkillGaps" },
{ "data": "technicalAvgSkills" },
{ "data": "feedbackType" },
{ "data": "feedbackId" },
{ "data": "isNew" },

]
});


Which is creating my datatable layout and I am calling below function on dropdown change event is :

function loadFeedback(){

viewdatatabJS = $('#dataTablesFeedback').dataTable({
"processing" : true,
"retrieve" : true,
"ajax" : "/nhp/rest/feedback/viewFeedback",
"fnServerParams": function ( aoData ) {
aoData.push( { "name": "userName", "value":employeeId } ,
{ "name": "resourceId", "value":mentorDataJson[$('#dropDownId').val()].resourceId });
},
});
}


Where I am passing some parameter in aoData.push but my URL is not getting called.

Answer

I Solved the issue by simply implementing datatable properties. i wrote my code of datatable

      var viewdatatab  =  $('#dataTablesFeedback').dataTable({                    

            "columns": [

                { "data": "resourceId" },
                { "data": "feedbackRecommendation" },
                { "data": "technicalSkillGaps" },
                { "data": "technicalAvgSkills" },
                { "data": "feedbackType" },
                { "data": "feedbackId" },
                { "data": "isNew" },

            ]
    }); 

in jsp document.ready(function()) and then on my request call of drop down change event i wrote below code on my javascript function.

      $.ajax({
      url : "",
      type: 'GET',
      contentType: "application/json",
      data:  {
            'userName': value,
            'resourceId' : value,
         },
           success: function(data) {
            var table = $('#dataTablesFeedback').DataTable();
            table.clear();
            table.rows.add(data.data);
            table.draw();     
         });

this way i first clear my datatable and then redraw it using my json which i got from my ajax call. Thanks

Comments