jquery datepicker get the date on mouseover from the cell

Question

I want to get the date on mouse over. A small div-box will appear and display some data related with that date. when mouse is running over the calendar. I need the date where the mouse is running so I will be able to call right values to display in the div-box. The code below show the date gathering from the cell. But I need full date including month and year.

$('.ui-state-default').mouseover(function(){

    var a= $(this).text();
    alert(a);
});

And also I found this code. But does not really work for me. Any help is appreciated.

Thanks in advance.

Answer 1

var month = $(this).closest('.ui-datepicker').find('.ui-datepicker-month').text();
var year  = $(this).closest('.ui-datepicker').find('.ui-datepicker-year').text();

Answer 2

Just like Yoda mentioned you will want to use the live method to attach the event on the document so any created elements that match the selector behave the same way.

You will end up with something like this:

<h1></h1>

<label for="pickDate"/>
<input type="text" id="pickDate"/>

$(function() {
    $("#pickDate").datepicker();
    $(".ui-state-default").live("mouseenter", function() {
        $("h1").text($(this).text());
    });
});

Example on jsfiddle

Answer 3

The calendar is made after the DOM is ready, so that will never work unless you use a method like this :

http://api.jquery.com/live/