Kaustubh
Kaustubh

Reputation: 1505

Focus out of a textbox on datepicker change

I want to focus out of a textbox when the user is in the process of selecting a date from the datepicker. HTML

<input id="startDate" class="datepicker rounded hasDatepicker" type="text" name="startDate" readonly="">
<img class="ui-datepicker-trigger" src="images/calendar_icon.png" alt="...">

The script I tried.

$('.datepicker').datepicker({
    showOn: "button",
    buttonImage: "images/calendar_icon.png",
    buttonImageOnly: true,
    onChangeMonthYear: function(year, month, inst) {
        $("#startDate").blur();
    },
    onSelect: function(dateText, inst) {
        $("#startDate").focusin();
    }
});​

Please help!

Upvotes: 0

Views: 15766

Answers (1)

gmo
gmo

Reputation: 9000

Try adding the beforeShow and onClose event in your code...

Example:

$(function() {
    $('.datepicker').datepicker({
        beforeShow:function(input, inst){$(this).css('color','white')},
        onClose:function(dateText, inst){$(this).css('color','black')}
    });
});

But remember... Known issue: Datepicker does not trigger a create event.

Source: jQuery UI datepicker#event-beforeShow


EDITED with new option:

HTML Example

Date: <input type="text" id="datepicker" readonly="readonly">​

jQuery

$(function(){$('#datepicker').datepicker()});

​Example in: http://jsfiddle.net/nNPJS/2/

Upvotes: 2

Related Questions