CODEWITHSUNDEEP
jqueryjquery-pluginsdatetimepicker
Laguna
Laguna

Reputation: 3876

Prevent timepicker addon from opening calendar

I asked the following in an old question:

I'm using the timepicker plugin for jquery. once users selected a date+time and click on the "Done" button, which basically just closes the dialog, i want the textbox where datetime is set to gain back focus (the current behavior of the plugin is to blur out focus). This is because on this page i have a set of textboxes and their tab orders are set sequentially. i need the datetime textbox to gain back focus to continue the tab order. otherwise the tab order will restart from the first text input which is inconvenient for the user.

I got back a working answer below

$('#MyDatepicker').datetimepicker({
   onClose: function(dateText, inst) {
     $('#MyDatepicker').focus();
  }
});

but this is my new challenge: now the textbox has its focus back, the calendar opens again. how do i prevent that?

Upvotes: 2

Views: 542

Answers (2)

mrtsherman
mrtsherman

Reputation: 39872

So I was thinking about this one over the weekend after messing around with trying to get it to work, when I realized that maybe the best behavior is not to set focus back at all! Thinking about your users, once they have explicitly selected a date, why would they want focus back on the same field? So instead set focus to the next input.

http://jsfiddle.net/QwQwN/

$(function() {
    $(".date").datepicker({ });
});

$('.date').change( function() {
    $(this).nextAll('input:first').focus();
});

I tried using the onClose events of the date picker, but changing focus midstream broke the plugin. I dont think this is possible without modifying the actual plugin code.

Upvotes: 1

Snake Eyes
Snake Eyes

Reputation: 16764

did you try this ?

$('#MyDatepicker').datetimepicker({
   onClose: function(dateText, inst) {
     $(this).focus();
     $(this).unbind();  //this works in IE
  }
});

Upvotes: 1

Related Questions