Jquery UI多选日期选择器

您好我有几个日期选择器都在同一类.datepicker下我有一个函数执行任何日期选取器的onSelect。然而，我想执行另一个功能选择特定的日期选择器我试图做一个单独的日期选择器分配到特定的一个我想要一个单独的功能，但似乎无法得到它的工作Jquery UI多选日期选择器

原始日期选择器类

$(".datepicker").datepicker({ 

      dateFormat: 'yy-mm-dd', 
      showButtonPanel: true, 
      onSelect: function (date_check) { } 

})

我的具体目标日期选择器，其还拥有一流的日期选择器的。

$("#myDate").datepicker({ 

       dateFormat: 'yy-mm-dd', 
       showButtonPanel: true, 
       onSelect: function (date_assign) { } 

    })

我的问题是：

有没有办法我可以指定与.datepicker类特定datepickers，进行二次ONSELECT功能特定日期选择器。还是有不同的方式？

* NB datepicker必须能够执行.datepicker类下的原始功能和新功能。

UPDATE

<input class="datepicker" id="a"> </input> 
<input class="datepicker" id="b"> </input> 
<input class="datepicker" id="myDate"> </input>

在a或b或指明MyDate的选择运行原始.datepickeronSelect功能

在选择的具体数值指明MyDate运行原始.datepickeronSelect并运行一个单独的ONSELECT功能。

来源

2016-04-05 Mr Dansk

然后创建一个自定义事件触发的onSelect，从选择的参数并自定义事件：

$('#myDate').on('customevent', function(e, dateText, inst) { 
    alert('custom triggered' + dateText); 
}); 
$(".datepicker").datepicker({ 
    dateFormat: 'yy-mm-dd', 
    showButtonPanel: true, 
    onSelect: function(dateText, inst) { 
    if ($(this).is('#myDate')) { 
     $('#myDate').trigger("customevent", [dateText, inst]); 
    } 
    // do universal code 
    alert('Date:' + dateText); 
    } 
});

玩弄它h ERE：https://jsfiddle.net/MarkSchultheiss/3grqL8c9/

来源

2016-04-05 13:13:12

您可以检查是否选择onSelect已被分配，如果是把它添加到功能，像这样

var onSelectFn = $("#myDate").datepicker("option", "onSelect") 
$("#myDate").datepicker({ 
       dateFormat: 'yy-mm-dd', 
       showButtonPanel: true, 
       onSelect: function (date_assign) { 
        if(typeof onSelectFn === 'function') onSelectFn(); 
        // do the next function 
       } 

    })

UPDATE

，以更新#myDate选择的onSelect财产你需要像这样工作

第一个datePicker所有的.datepicker元素都像所以

$(".datepicker").datepicker({ 
       dateFormat: 'yy-mm-dd', 
       showButtonPanel: true, 
       onSelect: function (date_assign) { 
        if(typeof onSelectFn === 'function') onSelectFn(); 
        // do the next function 
       } 

    })

然后更新的#myDate

$("#myDate").datepicker("option", "onSelect",function(data_assign){ 
    // your new functionality 
})

应该做的伎俩:)

来源

2016-04-05 12:06:51 Zamboney

对不起，如果“#myDate”元素是“选中”，这只会运行第二个函数吗？ –

没有它会同时运行它们，你想禁用第一个并运行其他？ – Zamboney

好的，但我只想在选择“#myDate”日期选择器时运行第二个功能。我会尽力在我的问题中提供和举例。看看我的更新，看看这是否解释了我想要实现的。 –

我设法回答我的问题：

$(".datepicker").datepicker({ 
      dateFormat: 'yy-mm-dd', 
      showButtonPanel: true, 
      onSelect: function (date_check) { 

      //DO SOME FUNCTION STUFF 

      if($(this).attr('id') == "myDate") { 

      //DO SOME EXTRA STUFF 

      } 
     } 
});

它是如何工作

每一个日期选择器使用.datepicker类，并执行第一个功能，但是当您单击#myDate日期选择器它获得$(this)的id属性，根据jQuery UI Datepicker API：

onSelect函数离子

当选择日期选择器时调用。该函数接收选定日期作为文本和日期选择器实例作为参数。 this引用关联的输入字段。

因此this让你获得当前点击的日期选择器。然后，您可以对ID与您希望匹配的元素进行比较，然后执行第二个功能。

来源

2016-04-06 06:12:34

Jquery UI多选日期选择器

回答

相关问题