POST variable is null when using AJAX call - php

Question

I am trying to POST the value selected in a dropdown list using AJAX call. But the POST variable remains blank when the value is selected from the dropdown.
I have used the ECHO method to check whether it is returning the POST value. But it is empty.
Here is the code for reference:
Javascript (Jquery and Ajax):
<script>
$(document).ready(function(){
$("#booking_date").change(function(){ //listen when the option change
var optionValue = $("#booking_date").val(); //get the new value
$.ajax({
url: "doctordetails.php", //php file which recive the new value and save it to the database
data: { optionValue: optionValue }, //send the new value
type: "POST" , //use POST method
success: function(data) {
console.log(optionValue);
}
});
});
});
</script>
HTML:
<div class="row">
<div class="col-6">
<div class="form-group">
<input class="form-control" type="text" id="booking_date" name="booking_date" data-lang="en" data-min-year="2017" data-max-year="2020" data-disabled-days="10/17/2017,11/18/2017">
</div>
</div>
<div class="col-6">
<div class="form-group">
<select class="form-control">
<option value="">Select slot</option>>
<?php
require_once("dblogin.php");
?>
<option value="<?php echo $_POST[" optionValue "]; ?>">
<?php echo $_POST["optionValue"]; ?>
</option>
</select>
</div>
</div>
</div>
Expected result:
$_POST should return the selected value from booking_date and the $_POST value will be used in a SQL Query.

Answer 1

If this is dropdown list, then id must be on select box. You set id booking_date on textbox other than select box. write as:
<select id="booking_date" class="form-control">
</select>

Answer 2

If you want to value from select(dropdown) so you have to set id on <select> rather than textbox <input>
<select id="booking_date" class="form-control">
<option value="">Select slot</option>>
<?php require_once("dblogin.php"); ?>
<option value="<?php echo $_POST["optionValue"]; ?>">
<?php echo $_POST["optionValue"]; ?>
</option>
</select>
On Script:
<script>
$(document).ready(function(){
$("#booking_date").change(function(){ //listen when the option change
var optionValue = $(this).val(); //get the new value
$.ajax({
url: "doctordetails.php", //php file which recive the new value and save it to the database
data: { getValue: optionValue }, //send the new value
type: "POST" , //use POST method
success: function(data) {
console.log(data);
}
});
});
});
</script>