jquery – 如何从另一个功能启动DatePicker的BeforeShowDay

前端之家收集整理的这篇文章主要介绍了jquery – 如何从另一个功能启动DatePicker的BeforeShowDay前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个Datepicker与以下代码。我有一个dropdownBox,并在dropDown框中更改我想启动datePicker beforeShowDay函数。我该怎么做?
  1. var freeDate;

我的代码部分如下:

  1. $("#myDiv").datepicker({
  2. showOtherMonths: true,selectOtherMonths: true,dateFormat: "yy/mm/dd",onSelect: function(dateText,inst) {},onChangeMonthYear: function(year,month,inst) {
  3. $.ajax({
  4. contentType: "application/json; charset=utf-8",dataType: "json",url: '@Url.Action("ListDates","Party")',data: {
  5. date: new Date(year,month - 1,1).toString("yyyy/MM/dd"),userID: userID
  6. },success: function(data) {
  7. freeDate = eval(data);
  8. },error: function(request,status,error) {}
  9. });
  10. },beforeShowDay: function(dateToShow) {
  11. var returnResult = new Array();
  12. returnResult.push(true);
  13. var itemMatched = false;
  14. $.each(freeDate,function(key,value) {
  15. if (new Date(parseInt(value.substr(6))).compareTo(dateToShow) == 0) {
  16. itemMatched = true;
  17. returnResult.push('timeNotFree');
  18. return;
  19. }
  20. });
  21. if (!itemMatched) returnResult.push('');
  22. returnResult.push('');
  23. return returnResult;
  24. }
  25. });​
  1. $('#myList').change(function() {
  2. userID = $("#userList > option:selected").attr("value");
  3. // myList is used to have freeDate and the DatePicker must be shown accordingly.
  4. $.ajax({
  5. contentType: "application/json; charset=utf-8",data: {
  6. date: new Date($("#myDiv").datepicker("getDate").toString("yyyy/MM/dd")),userID: userID
  7. },success: function(data) {
  8. freeDate = eval(data);
  9. },error) {}
  10. });
  11. $("#myDiv").datepicker("setDate",$("#myDiv").datepicker("getDate").toString("yyyy/MM/dd"));
  12. });​

解决方法

beforeShowDay是在一天呈现之前由datepicker触发的事件。您可以使用它来自定义如何显示包含该日期的单元格,例如您可以将其变为红色以指示阻止的日期。

从我从你的问题中可以看出,您可以调用datapicker.refresh()方法来指示freeDate变量已经更改(例如通过AJAX响应),并且需要再次渲染日历。

编辑

我相信这是你的下拉列表的代码,好像它使用ajax:

  1. $('#myList').change(
  2. ...

在成功回调中,你有:

  1. freeDate = eval(data);

这是freeDate更改的地方,这可能是您应该调用.refresh()方法的地方。请注意,默认情况下,AJAX是异步的,所以选择值和成功事件回调之间有一些延迟。

这里是如何调用现有日期戳的方法

  1. .
  2. .
  3. .
  4. freeDate = eval(data);
  5. $("#myDiv").datepicker("refresh");
  6. .
  7. .
  8. .

猜你在找的jQuery相关文章