具有可点击事件的jQuery日历

Question

I have created a jQuery calender with highlighting selected date. I want to display the events on the selected date from database. I stored the selected date in variable "x" but how do I link the javascript variable with "x" so that I can compare the date with events on that date in database and display those events in the corresponding div?

<div id="calendar"></div>
Date:<input type="text" id="datepicker_send" name="datepicker_send" readonly="readonly">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
<script src="/jquery-ui-datepicker.min.js"></script>
<script>

var x='';

    $('#calendar').datepicker({
        altField: '#datepicker_send',
        inline: true,
        firstDay: 1,
        showOtherMonths: true,
        altFormat: "dd/mm/yy",
        dateFormat: "dd/mm/yy",
        dayNamesMin: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
        onSelect: function(dateText){
            $('#event-date').text(dateText)
            x=dateText;
            //alert(x);
            }  
        });
</script>

Answer 1

You can call an ajax function which will check the events for that particular date in database.You will get the response and can show the events in alert, tooltip or in any div as you wish.

onSelect: function(dateText){
 $('#event-date').text(dateText)      
 // call ajax function here and send dateText
}