Динамические блокировки даты jquery datepicker - PullRequest
0 голосов
/ 22 октября 2018

У меня есть пользовательская форма встречи с несколькими местами.По воскресеньям все места закрыты.По субботам открыто только несколько мест.Одно место настолько занято, что все встречи должны быть как минимум за 1 неделю.

Я нашел ответы, говорящие: «Вы не можете обновить текущий сборщик. Вам нужно уничтожить его, установить зарезервированные датыв массиве, и перестройте DatePicker с этими параметрами. ", что означало дублирование DatePicker, который находится в пользовательской форме со всеми его странными региональными форматами и параметрами.чем это того стоило, я обнаружил, что вы можете просто динамически использовать следующие 7 дней:

$('input.datepicker').datepicker( 'option', 'minDate', '+7d');

Это работает!Затем также обнаружил, что вы можете сказать текущему датчику, чтобы он переключился на сегодняшнюю дату, с помощью этого:

$('input.datepicker').datepicker('setDate', 'today');

Так я могу получить живой инструмент выбора даты, чтобы скрыть выходные?Я должен быть в состоянии, но вариант, который я нашел, терпит неудачу:

$('input.datepicker').datepicker({ beforeShowDay: jQuery.datepicker.noWeekends });

Я действительно хочу быть в состоянии сказать, «без выходных» или «без воскресений», без разрушения и восстановления, но это не популярнотема, так как большинству форм не нужно динамически обновлять средство выбора даты.

Вот простая скрипка того, что я хотел бы выполнить: https://jsfiddle.net/56qsau34/

РЕДАКТИРОВАТЬ: Таким образом, я был действительно близок, но у меня был неправильный метод (?) Для применения обновления кЖивая DatePicker.Если вы возьмете последнее предположение и напишите правильно, это сработает!

$('input.datepicker').datepicker( 'option', 'beforeShowDay', jQuery.datepicker.noWeekends );

РЕДАКТИРОВАТЬ # 2: Только для бедной души, которая находит это без окончательного решения.Когда вы поймете, что вам нужно «переключить» функцию noWeekends, эта функция, которая возвращает все даты с «true», очень пригодится:

$('input.datepicker').datepicker('option', 'beforeShowDay', function(d) {       
    var year = d.getFullYear(),
        month = ("0" + (d.getMonth() + 1)).slice(-2),
        day = ("0" + (d.getDate())).slice(-2);

    var formatted = year + '-' + month + '-' + day;

    //is it a sunday - this was the missing bit for all my specs
    if (d.getUTCDay() != 0) {
      return [true, "",""]; 
    }else{
      return [false, "",""];
    }
}

Ответы [ 2 ]

0 голосов
/ 23 октября 2018

Да, вы можете изменить options без разрушения виджета.

$.datepicker.noSundays = function (date) {
   return [ date.getDay() != 0, "" ];
}

$("#foo").click(function() {
  $("input").datepicker();
});

$("#nowknd").click(function() {
  $("#datepicker").datepicker('option', 'beforeShowDay', $.datepicker.noWeekends);
});

$("#okwknd").click(function() {
  $("#datepicker").datepicker('option', 'beforeShowDay', '');
});

$("#nosuns").click(function() {
  $("#datepicker").datepicker('option', 'beforeShowDay', $.datepicker.noSundays);
});

$("#weekblock").click(function() {
  $("#datepicker").datepicker('option', 'minDate', '+7d');
});
<link href="https://code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css" />
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>


<p>Date:<input type="text" id="datepicker"></p>
<p>
  <button id="foo">Make it a datepicker</button>
  <button id="nowknd">Block weekends</button>
  <button id="okwknd">Allow weekends</button>
  <button id="nosuns">Block Sundays</button>
  <button id="weekblock">Block off a week</button>
</p>
0 голосов
/ 23 октября 2018

Это помогает? Можно ли настроить DatePicker для пользовательского интерфейса jQuery для отключения суббот и воскресений (и праздничных дней)?

выходные дни видны, но недоступны для выбора.

<!doctype html>
<html class="no-js" lang="">

<head>
  <meta charset="utf-8">
  <meta http-equiv="x-ua-compatible" content="ie=edge">
  <title></title>
  <meta name="description" content="">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

<!--
    want to hide weekends from calendar

    /411096/mozhno-li-s-pomoschy-jquery-ui-datepicker-otklychit-subbotu-i-voskresene-i-prazdnichnye-dni


-->


  <title>jQuery UI Datepicker - Disable the Selection of some days  </title> 


    <link href="jquery-ui-1.10.3.css" rel="stylesheet">

              <script
              src="https://code.jquery.com/jquery-2.2.0.min.js"
              integrity="sha256-ihAoc6M/JPfrIiIeayPE9xjin4UWjsx2mjW/rtmxLM4="
              crossorigin="anonymous"></script>


              <script
              src="https://code.jquery.com/ui/1.10.3/jquery-ui.min.js"
              integrity="sha256-lnH4vnCtlKU2LmD0ZW1dU7ohTTKrcKP50WA9fa350cE="
              crossorigin="anonymous"></script>


    <script type="text/javascript">


        $(function () {
            $(".datepicker1").datepicker({
                beforeShowDay: $.datepicker.noWeekends
            });
        });
    </script>

</head>
<body>
    <h3>Click in the TextBox to select a date :</h3>
    <p>weekends are not selectable</p>
    <input type="text" class="datepicker1" />

</body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...