How do I generate data on a datatable based on a daterange using 2 datepickers?
How do I generate data on a datatable based on a daterange using 2 datepickers?
Hi everyone, I have 2 datepickers, namely start date and end date using bootstrap-datepicker. And I have a jquery datatable which lists the order details, I want to load data from say 2016-04-01 to 2016-04-15 on the order date columns. I have tried the code here: https://datatables.net/plug-ins/filtering/row-based/range_dates , but it is affecting my other filtering code.
I have attempted this for fetching prices and it worked perfectly. I have followed this link: https://datatables.net/examples/plug-ins/range_filtering.html
This is the code I am attempting based on the range-filtering link:
$.fn.dataTable.ext.search.push(
function( settings, data, dataIndex ) {
var date_min = parseInt( $('#min').val(), 10 );
var date_max = parseInt( $('#max').val(), 10 );
var date = parseFloat( data[0] ) || 0;
if ( ( isNaN( date_min ) && isNaN( date_max ) ) ||
( isNaN( date_min ) && date <= date_max ) ||
( date_min <= date && isNaN( date_max ) ) ||
( date_min <= date && date <= date_max ) )
{
return true;
}
return false;
}
);
$('#min, #max').keyup( function() {
table.draw();
} );
<div class="col-md-7">
<div class="input-daterange input-group" id="datepicker">
<input type="text" class="input-md form-control" placeholder="Start Date" name="start_date" id="min" required="">
<span class="input-group-addon" ><label class="to">to</label></span>
<input type="text" class="input-md form-control" placeholder="End Date" name="end_date" id="max" required="">
</div>
</div>
How do I pass the values from id="min" and id="max" and load the dates within the range onto the datatable? Or if possbile, how do I rectify these lines to load the same?
var date_min = parseInt( $('#min').val(), 10 );
var date_max = parseInt( $('#max').val(), 10 );
var date = parseFloat( data[0] ) || 0;
Any help will be greatly appreciated. Thank you