PHP: How to Post date in URL after selecting date in jQuery DateRangePicker?

I am using jQuery DateRangePicker in PHP with one selected date only – Calender UI and trying to fetch data from my MongoDB collection, whenever I select date its value will be alerting and after alerting value should be call in place of $currentdate in $filter = [‘date’ => $currentdate], but filter is define above jQuery code.

PHP Code

$filter = ['date' => $currentdate]; 

HTML Code –

   <div class="text-right mr-2">
<div class="header-date py-3 text-right">
<span id="reportrange"><i class="icofont-calendar"></i></span>
 <input type="hidden" id="hidreportrange"> 
</div>
</div> 

jQuery

$('#reportrange').on('apply.daterangepicker', (e, picker) => { 
           var startDate = picker.startDate.format('YYYY-MM-DD'); 
           alert(startDate);

Answer

First you have to embed an event on date selection.

$("#dateInput").datepicker({
    onSelect: function(dateText) {
        // do something
    }
});

---

Without Ajax

Now suppose you have this form

<link href="http://code.jquery.com/ui/1.9.2/themes/smoothness/jquery-ui.css" rel="stylesheet" />
<form id="myform" action="/action_page.php">
  <input type="text" id="dateInput" class="date">
  <input type="submit" value="Submit">
</form> 
<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>

To trigger a form submission to action_page.php your js will look like this:

$("#dateInput").datepicker({
    onSelect: function(dateText) {
        $("#myform").submit(); // this will submit the form
    }
});

---

With Ajax

While I am not sure to what extended I understood your question. However, I am assuming you trying to check the date against certain logic in the backend. To make it asynchronous (no page refresh) your js will look like the following:

$("#dateInput").datepicker({
    onSelect: function(dateText) {
    $.ajax({
        url: '/action_page.php',
        type: 'post',
        data: "dateValue=" + dateText,
        success: function(data) {
                   console.log(data); // display backend response on the console
        }
    });
    }
});