Alex Rivera | Logout

JQuery Datepicker, can't trigger onSelect event manually!

Asked 2010-01-28T15:12:11.270
9

I am using jquery's datepicker where a list of items is populated from an ajax call whenever a date is picked from an inline datepicker object. The script works perfect except that I can't trigger an onSelect event to populate my initial list of items.

I could get around this problem by just populating the list initially using php but I would really like to avoid this.

    $(document).ready(function(){

        //create date pickers
    $("#date_calendar").datepicker(
  { 
        changeMonth: true,
        changeYear: true,
        dateFormat: 'yy-mm-dd',
        defaultDate: $.datepicker.parseDate("y-m-d", $('#date').val()),
        onSelect: function(dateText, inst)
            {
                alert('onSelect triggered! Yay!');
                $('#date').val($.datepicker.formatDate("yy-mm-dd", $('#date_calendar').datepicker('getDate')));

                // Ajax for populating days when selected
                $.post(
                    "server_requests/show_day.php",
                        {
                        date: $('#date').val(),
                        user_id: $('#user_id').val()
                        },
                    function(data)
                    {
                        //return function
                        $('#my_day_tasks').html(data.resultTable);
                    },
                    "json"
                );
            }
    }).disableSelection();

    $("#date_calendar").trigger('onSelect');

});

Any help is appreciated :)

jquery event-handling datepicker
Edit
Report

1 Answer

3

This is how I got round the same problem. Simply register an event with the code you want to call, then call that event from the onSelect method inside datepicker and then call that same event any other time you want.

$(document).ready(function(){

    // Onselect event registration
    $("#date_calendar").bind("datepickeronSelect", function(){

        alert("onSelect called!");

    })

    //create date pickers
    $("#date_calendar").datepicker(
    { 
        changeMonth: true,
        changeYear: true,
        dateFormat: 'yy-mm-dd',
        defaultDate: $.datepicker.parseDate("y-m-d", $('#date').val()),
        onSelect: function(dateText, inst)
        {
            $("#date_calendar").trigger("datepickeronSelect");
        }
    }).disableSelection().trigger("datepickeronSelect");
});
answered 2012-02-24T00:56:04.200

Your Answer