<div class="x_content">
    <div class="well" style="overflow: auto">
      <div class="col-md-4">
        <div id="reportrange_right" class="pull-left" style="background: #fff; cursor: pointer; padding: 5px 10px; border: 1px solid #ccc">
          <i class="glyphicon glyphicon-calendar fa fa-calendar"></i>
          <span></span> <b class="caret"></b>
        </div>
      </div>
    </div>
    </div>
    <?php
    echo "<script>document.writeln(startdate)</script>";
    echo "<script>document.writeln(enddate)</script>";
    ?>

$('#reportrange_right').on('apply.daterangepicker', function(ev, picker) {
                  console.log("apply event fired, start/end dates are " + picker.startDate.format('MMMM D, YYYY') + " to " + picker.endDate.format('MMMM D, YYYY'));
                  var startdate = picker.startDate.format('MMMM D, YYYY');
                  var enddate =  picker.endDate.format('MMMM D, YYYY');
                  console.log(startdate);
                  console.log(enddate);
                  console.log(picker.startDate.format('MMMM D, YYYY'));
                  $.post('date2.php', {_startdate:startdate, _enddate:enddate}).done(function(){});
                  location.href = '../production/date2.php';
                });