Search code examples
jquerybootstrap-datepicker

Jquery select current data

I'm trying to select a first row of Bootstrap-datepicker. For some reason, it's always selected a previous month not the current month.

For example: When I click a next month, it shows me a previous data from last month. But I want to show data from current month.

Here's my code: jsfiddle.net/cxtzk6sj/1/

Solution

  • The problem with your approach is that click event happens before datepicker renders new month. Datepicker itself subsribes to click event on next and prev buttons and your event handler is executed before their.

    Very simple solution is to get dates in the next "tick" which you can achieve with setTimeout with zero timeout:

    $("input").datepicker().on('changeMonth', function() {
    setTimeout(function() {
        $(".datepicker-days tbody > tr:first-of-type").each(function () {
            $("#result").append("<p>" + $(this).context.innerText + "</p>");
        });
    });
});

    Also it's better to use API for month change: "changeMonth" event in your case.

    Demo: http://jsfiddle.net/cxtzk6sj/2/