Date value Not updating in Date field

In Web app I used Jquery to disable the Tuesday and Thursday options in the date picker.
When I select a date in the first click, it does not update, but it does update when I select it again, and the previous date only updates in the date field, not the date I am currently selecting.

FYI:Date field has Date data type

This is the Code Which I tried 
<script src="https://code.jquery.com/jquery-3.6.4.min.js"></script>
<!-- jQuery UI -->
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

$(function() {
var selectedDay; // Declare the variable in a broader scope

$("#datepicker").datepicker({
minDate: 0, // Disable past dates
beforeShowDay: function(date) {
selectedDay = date.getDay(); // Store the day in the broader scope variable

return [selectedDay === 1 || selectedDay === 3 || selectedDay === 5]; // Disable Mondays
},
onSelect: function(dateText, inst) {
// Now you can access the selectedDay variable here
console.log(selectedDay);
}
});
});

here is the date input field
<strong> Date</strong>:</label> <input name="datepicker" id="datepicker" type="text" data-nl-label="Date" data-nl-xpath="@date" data-nl-bindto="xpath" data-nl-type="date" /> <!--<select name="cvv" id="cvv" data-nl-label="Date" data-nl-xpath="@date" data-nl-bindto="xpath">

Thanks in advance