Geek asks and answers

Unable to bind event with datetimepicker plugin

I am using Timepicker for jQuery user Trent Richardson. I know that the plugin has been modified to override $ .datepicker._selectDate so that the selector remains open when the date is selected. It's great.

However, I was asked to close the collector by double-clicking the date. Everything else remains unchanged, including a button to close the collector when this is done, etc., only they want the double click to work as well.

I tried to associate a double-click event with calendar dates in several ways (basically the options $('.ui-datepicker-calendar a').bind('dblclick', function () {/*do something*/});)- indeed, I also tried to associate other events - and nothing works. I tried the sentences sent for How to close a DateTimePicker with a double-click without joy.

Is it possible? Do I need to change the onSelect function to distinguish between click and double click? (And how, when event.typeis undefined?) Am I attached to the wrong element? (I tried to tie in the $('.ui-datepicker-calendar a'), $('#ui-datepicker-div'), $('#ui-datepicker-div .ui-datepicker-calendar a')and many other options.)

For completeness, here is my code:

$('#date-range-from, #date-range-to').datetimepicker({
    changeYear: true,
    changeMonth: true,
    controlType: 'select',
    dateFormat: 'M dd, yy ',
    minDate: 'Jan 01, 2010 ',
    maxDate: 'Dec 31, xxxx '.replace('xxxx', new Date().getFullYear() + 1),
    showAnim: '',
    showMinute: false,
    showOtherMonths: true,
    showTime: false
}).on('change', function () {
    var t = $(this),
        date = t.val().slice(0, 12),
        fromto = t.attr('id').replace('date-range-', ''),
        time = t.val().slice(-5);
    dashboardOpts.dateRange[fromto].date = date;
    dashboardOpts.dateRange[fromto].time = time;
}).mousedown(function () {
    $('#ui-datepicker-div').toggle();
    $(this).blur();
});
$('#ui-datepicker-div .ui-datepicker-calendar a').bind('dblclick', function () {
    console.log('I just want to see if this event can be bound!');
});

Thanks in advance for your help!

Edit: To clarify, “options ... .bind('dblclick', ...)” I meant that I tried .live('dblclick', ...)(although I know that it is out of date) and $(element).on('dblclick', ...)and $(document).on('dblclick', element, ...).

I also tried .stopPropagation()and .stopImmediatePropagation()although I do not think this is a distribution problem.

I believe there is something in the datetimepicker plugin code that captures events on the calendar. Unfortunately, I could not find it yet. Any insight is greatly appreciated!

+5
3

datetimepicker , . .

, datepicker , . onSelect:

 $('#mydatepicker').datetimepicker({
     onSelect: function (e, t) {
         if (!t.clicks) t.clicks = 0;

         if (++t.clicks === 2) {
             t.inline = false;
             t.clicks = 0;
         }
         setTimeout(function () {
             t.clicks = 0
         }, 500);
     }
 });

, - dblclick -. 500 , , , dblclick .

UPDATE

@JaredKnipp , (unvalid???), , , . , endDateTextBox onClose callback:

         var focusHandlers = $._data(endDateTextBox[0], "events").focus;
         $._data(endDateTextBox[0], "events").focus = {};
         endDateTextBox.one('focusin.datetimepicker mouseenter.datetimepicker', function () {
             setTimeout(function () {
                 $._data(endDateTextBox[0], "events").focus = focusHandlers;
                 endDateTextBox.blur();
             }, 0);
             $(this).off('focusin.datetimepicker mouseenter.datetimepicker');
         });

: jq- 1.8, $.data() not $._data() , ...

+6

?

$('#ui-datepicker-div .ui-datepicker-calendar a').dblclick(function () {
  console.log('I just want to see if this event can be bound!');
});

dblclick docs.

0

Edit

try also livein jquery 1.7 or onin jquery 1.9:

$('#ui-datepicker-div .ui-datepicker-calendar a').live('dblclick', function () {
  alert('I just want to see if this event can be bound!');
});

try to untie a tagbefore tying it. it may be associated with another function:

$('#ui-datepicker-div .ui-datepicker-calendar a').unbind('dblclick');
$('#ui-datepicker-div .ui-datepicker-calendar a').bind('dblclick', function () {
  alert('I just want to see if this event can be bound!');
});
0
source

More articles:


All Articles