fnServerParams unable to send custom parameter to server
fnServerParams unable to send custom parameter to server
vishalmelmatti
Posts: 5Questions: 1Answers: 0
I am trying to send custom parameter "daterange" to server using fnServerParams but unable to send. Can anybody please help me ?
Below is my code,
$(function() {
/* Formating function for row details */
function fnFormatDetails ( scheduledJobsGridTable, nTr )
{
var jid = $(nTr).find('.scheduled_job_id').val();
var jtype = $(nTr).find('.scheduled_job_type').val();
var sOut = $.ajax({
url: '<?php echo site_url('jobs/jobDetails'); ?>',
data: 'jid='+jid+'&jtype='+jtype,
type: 'POST',
dataType: "html",
async: false
}).responseText;
return sOut;
}
/*
* Insert a 'details' column to the table
*/
var nCloneTh = document.createElement( 'th' );
$('#scheduledJobsGrid thead tr').each( function () {
this.insertBefore( nCloneTh, this.childNodes[0] );
} );
scheduledJobsGridTable = $('#scheduledJobsGrid').dataTable( {
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "<?php echo site_url('jobs/scheduledGrid'); ?>",
"bPaginate": true,
"sPaginationType": "full_numbers",
"bLengthChange": false,
"bFilter": true,
"bSort": true,
"bInfo": false,
"bAutoWidth": false,
"sScrollY": "450px",
"fnServerParams": function ( aoData ) {
aoData.push( { "name": "datetime", "value": $('#scheduled-jobs-filter-daterange').val() } );
},
"aoColumns": [
{ "bSortable": false, "aTargets": [ 0 ], "sClass": "left", "sWidth": "2%"},
{ "bSortable": false, "sClass": "center", "sWidth": "2%"},
{ "bSortable": false, "sClass": "center", "sWidth": "2%"},
{"sClass": "left", "sWidth": "10%"},
{"sClass": "left", "sWidth": "10%"},
{"sClass": "left", "sWidth": "8%"},
{"sClass": "left", "sWidth": "15%"},
{"sClass": "left", "sWidth": "8%"},
{"sClass": "left", "sWidth": "7%"},
{"sClass": "left", "sType": "date-euro", "sWidth": "8%"},
{"sClass": "left", "sWidth": "8%"},
{"sClass": "left", "sWidth": "8%"},
{ "bSortable": false, "sClass": "left", "sWidth": "8%"}
]
} );
$('#scheduled-jobs-filter-daterange').daterangepicker({
dateFormat: 'mm-dd-yy',
onOpen: function(){
$('a', $('.ui-daterangepicker-dateRange:visible').not('.ui-state-active')).each(function(){
$(this).trigger('click')
})
$('ul.ui-widget-content').hide()
},
onChange:function (){
scheduledJobsGridTable.fnDraw();
}
});
/* Add event listener for opening and closing details
* Note that the indicator for showing which row is open is not controlled by DataTables,
* rather it is done here
*/
$('.scheduled_job_details').live('click', function () {
var nTr = this.parentNode.parentNode;
if ( this.src.match('details_close') )
{
/* This row is already open - close it */
this.src = "<?php echo base_url();?>img/details_open.png";
scheduledJobsGridTable.fnClose( nTr );
}
else
{
/* Open this row */
this.src = "<?php echo base_url();?>img/details_close.png";
scheduledJobsGridTable.fnOpen( nTr, fnFormatDetails(scheduledJobsGridTable, nTr), 'details');
}
} );
} );
Below is my code,
$(function() {
/* Formating function for row details */
function fnFormatDetails ( scheduledJobsGridTable, nTr )
{
var jid = $(nTr).find('.scheduled_job_id').val();
var jtype = $(nTr).find('.scheduled_job_type').val();
var sOut = $.ajax({
url: '<?php echo site_url('jobs/jobDetails'); ?>',
data: 'jid='+jid+'&jtype='+jtype,
type: 'POST',
dataType: "html",
async: false
}).responseText;
return sOut;
}
/*
* Insert a 'details' column to the table
*/
var nCloneTh = document.createElement( 'th' );
$('#scheduledJobsGrid thead tr').each( function () {
this.insertBefore( nCloneTh, this.childNodes[0] );
} );
scheduledJobsGridTable = $('#scheduledJobsGrid').dataTable( {
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "<?php echo site_url('jobs/scheduledGrid'); ?>",
"bPaginate": true,
"sPaginationType": "full_numbers",
"bLengthChange": false,
"bFilter": true,
"bSort": true,
"bInfo": false,
"bAutoWidth": false,
"sScrollY": "450px",
"fnServerParams": function ( aoData ) {
aoData.push( { "name": "datetime", "value": $('#scheduled-jobs-filter-daterange').val() } );
},
"aoColumns": [
{ "bSortable": false, "aTargets": [ 0 ], "sClass": "left", "sWidth": "2%"},
{ "bSortable": false, "sClass": "center", "sWidth": "2%"},
{ "bSortable": false, "sClass": "center", "sWidth": "2%"},
{"sClass": "left", "sWidth": "10%"},
{"sClass": "left", "sWidth": "10%"},
{"sClass": "left", "sWidth": "8%"},
{"sClass": "left", "sWidth": "15%"},
{"sClass": "left", "sWidth": "8%"},
{"sClass": "left", "sWidth": "7%"},
{"sClass": "left", "sType": "date-euro", "sWidth": "8%"},
{"sClass": "left", "sWidth": "8%"},
{"sClass": "left", "sWidth": "8%"},
{ "bSortable": false, "sClass": "left", "sWidth": "8%"}
]
} );
$('#scheduled-jobs-filter-daterange').daterangepicker({
dateFormat: 'mm-dd-yy',
onOpen: function(){
$('a', $('.ui-daterangepicker-dateRange:visible').not('.ui-state-active')).each(function(){
$(this).trigger('click')
})
$('ul.ui-widget-content').hide()
},
onChange:function (){
scheduledJobsGridTable.fnDraw();
}
});
/* Add event listener for opening and closing details
* Note that the indicator for showing which row is open is not controlled by DataTables,
* rather it is done here
*/
$('.scheduled_job_details').live('click', function () {
var nTr = this.parentNode.parentNode;
if ( this.src.match('details_close') )
{
/* This row is already open - close it */
this.src = "<?php echo base_url();?>img/details_open.png";
scheduledJobsGridTable.fnClose( nTr );
}
else
{
/* Open this row */
this.src = "<?php echo base_url();?>img/details_close.png";
scheduledJobsGridTable.fnOpen( nTr, fnFormatDetails(scheduledJobsGridTable, nTr), 'details');
}
} );
} );
This discussion has been closed.