I am having an issue with the DHTMLX Calendar with the onChange in the input field.

I am initialisating the code with the following:

   jQuery(document).ready(function($){              
        var calendar;
        calendar = new dhtmlXCalendarObject(["date"]);
        calendar.hideTime();
        calendar.setDateFormat("%d/%m/%Y");
        $('.lightbox').lightbox();
        $('#slider').cycle();
    });
    function checkDate() {
        var date = $("[name='date']").val();
        alert(date);
    }

In the form i am using:

<input type="text" name="date" id="date" onchange="checkDate();" />

How it should be (and was working with JQuery UI datepicker) once the date is entered into the input field the onchange function would fire. However in this case: the onchange with this calendar does nothing.

I have tried changing the following to this:

   jQuery(document).ready(function($){              
        var calendar;
        calendar = new dhtmlXCalendarObject(["date"]);
        calendar.hideTime();
        calendar.setDateFormat("%d/%m/%Y");
        calendar.attachEvent("onChange",function(date, state){
               checkDate();
        });
        $('.lightbox').lightbox();
        $('#slider').cycle();
    });
    function checkDate() {
        var date = $("[name='date']").val();
        alert(date);
    }

But the onchange event happens before the date is entered, ie when i click on the input field.

Reason for changing from JQuery UI to this DHTMLX is that JQuery UI Datepicker does not support all platforms (iPhones/iPads etc) and DHTMLX does.