Bootstrap-datepicker，getDate不起作用

Question

I'm trying to figure out how I can get the date the user has selected on the datepicker. I've tried many things mentionned on this site, but it doesn't seem to work. Here's my code:

            // script for the date picker inline
            $('#calendar1 div').datepicker({
                keyboardNavigation: false,
                todayHighlight: true

                $("#calendar1 div").click( 
                var date = $("#calendar1 div").datepicker("getDate");
            });
            });

            // script for the datepicker text input
            $('#calendar2 .input-group.date').datepicker({
                keyboardNavigation: false,
                todayHighlight: true

                $("#calendar2 .input-group.date").click( 
                var date = $("#calendar2 .input-group.date").datepicker("getDate");
            });
            });

The datepickers appear fine when I don't run the .click(...), so I believe the problem is there.

Thanks

Answer 1

You have your closing braces in the wrong place, and your handlers need to be functions, like this:

// script for the date picker inline
$('#calendar1 div').datepicker({
    keyboardNavigation: false,
    todayHighlight: true
});

$("#calendar1 div").click(function() {
    // this is the selected element
    var date = $(this).datepicker("getDate");
});

// script for the datepicker text input
$('#calendar2 .input-group.date').datepicker({
    keyboardNavigation: false,
    todayHighlight: true
});

$("#calendar2 .input-group.date").click(function() {
    // this is the selected element
    var date = $(this).datepicker("getDate");
});

Answer 2

I had my markup like below for start and end date:

<div class="input-daterange dateselector"
                            id="publishedDateSelector">
    <input type="text" class="input-small form-control" /><input
                                type="text" class="input-small form-control" />
</div>

The following code initializing the datepicker:

$('.dateselector').datepicker({
    clearBtn : true,
    orientation : "top",
    todayHighlight : true
});

When I tried to get the date by '#publishedDateSelector').datepicker('getDate') , it used to return a jQuery object which was not a date representation. The way I got the dates are by:

'#publishedDateSelector input:first').datepicker('getDate'); //StartDate
'#publishedDateSelector input:last').datepicker('getDate');  //EndDate