how to write client event for linked datetime picker. I want to filter date range from datatable using them.

Basic date range filtering is working with 'date range' input. But can't set null values in the calender. Is there any way to set one of the values as null in the input.

<div class="col-md-6 form-group">
            <?php DateRangePicker::create(array(
            
                "name"=>"reportrange",
                  "format"=>"MMM Do, YYYY",
                "options"=>array(
                    "alwaysShowCalendars"=>true,
                    "showDropdowns"=>true,
               
                   "autoApply"=>true,
    
                )

            ));?>
          </div>

//script

$('#reportrange').on('apply.daterangepicker', function(ev, picker) {
   var start = picker.startDate.format('YYYY-MM-DD');
   var end = picker.endDate.format('YYYY-MM-DD');

  
  console.log("-----------------------------");

  $.fn.dataTable.ext.search.push(
    function(settings, data, dataIndex) {
      var min = new Date(start);
      var max = new Date(end);
      var startDate = new Date(data[7]);
      console.log(startDate +  " <= " + max  + " --- "  + (startDate <= max));
      
      if (min == null && max == null) {
        return true;
      }
      if (min == null && startDate <= max) {
        return true;
      }
      if (max == null && startDate >= min) {
        return true;
      }
      if (startDate <= max && startDate >= min) {
        return true;
      }
      return false;
    }
  );
  table.draw();
  $.fn.dataTable.ext.search.pop();
});

I think they want to have the date range picker control to have the ability to set either the FROM or TO date to null. In a case like this I would use two different controls because a "range" implies that two dates exist. I dont know what koolreport thinks about this however.

I meant exactly what Andrew Borell mentioned.Thank you for the clarification. I am trying to filter with date time picker now. But unable to draw correct result. will update asap

As I was writing some new db schema today I was thinking about this question and how it defies SQL schema. You would never write a statement such as:

select tbl.unique_id, tbl.field1, tbl.field2, tbl.field3, tbl.date1
from some_table tbl 
where CAST(tbl.date1 as TIMESTAMP) <= null ;

because you would have wasted a hit on the database for an empty result set.

With each datatype in sql there is an upper and lower constraint. NULL is not specific to any value. A field can only be a value within a valid range, or null, or not null but not greater or less than null because you cannot compare something that does not exist except in that it exists or not. Consider as example the MySQL TIMESTAMP datatype. The min value is 1970-01-01 and max value is 2038-01-19. If you query anything outside of that range you will encounter an overflow error. That being said, it would be silly to have a null option on a range control. What you might consider is setting the startDate and endDate on the control with custom buttons. As example I suggest a button to set the startDate to the minimum value based on the datatype for the field in the database, and a button to set the endDate to the max value based on the datatype for the field in the database. Or perhaps an "All" button that sets the startDate and endDate to those values in a single click. This can be done very easily with javascript against a bootstrap control.

Another option may be to use individual controls and initialize neither. You may need a button still to de-initialize each control ( a reset button ) if you wanted null on both if the end-user changed their mind so you don't need a page refresh. Then in your procedural code you could handle the parameters in whatever fashion that suits you best.

I am using date time picker for from and to date-time inputs. which is initiallised to the minimum and maximum range values from db respectively. With the help of editing javascript on the datatables built in range filter I am able to do filtering.But setting to null values is still not possible. The logic I intend to do is in the code below.

$.fn.dataTable.ext.search.push(
      function(settings, data, dataIndex) {

  var min =   $('#min').data("DateTimePicker").date();
   var max =  $('#max').data("DateTimePicker").date();
   var createDate = new Date(data[7])||0;//column that contains date-time values
   min=new Date(min);
   max=new Date(max);
            if (min == null && max == null) {  //if no input is given, it must draw the entire table as result
    return true;
  }
  if (min == null && createDate <= max) {/*if no from date is given, then from the beginning of range available in the db to given date etc..*/
    return true;
  }
  if (max == null && createDate >= min) {
    return true;
  }
  if (createDate <= max && createDate >= min) {
      console.log("working")
    return true;
  }
  return false;
}

);

Most datetimepicker controls do not allow nulls and will default the current datetime if set to null, which is the same behavior as you would see in a database. In MySQL for instance on insert into a column with the datetime datatype a null will be converted to the current timestamp. In this case I think you are seeing the expected behavior but desire a different result.

Kinda what i was implying but not suggesting a modification to KoolReport to make the adaptation in the control because i see the behavior as expected. In my head this is a matter of customizations and procedural code which would be up to the OP to implement but as the saying goes, "not my monkey, not my circus". If KoolReport dev wants to make it happen then im sure it will be nice regardless.