Многократный выбор даты javascript - PullRequest
Новая
       21

Многократный выбор даты javascript

0 голосов
/ 15 ноября 2018

Я хочу создать форму ввода, чтобы позволить пользователю добавлять ежемесячные повторяющиеся элементы в мое приложение.Пользователь может выбрать несколько дат из месяца.После поиска в Google я нашел AlloyUi DatePicker, используя несколько типов.

Мои вопросы:

  1. Как сделать множественный выбор без управления прессой?В настоящее время, если щелкнуть мышью без элемента управления в другой день, все остальные дни будут удалены.
  2. Как изменить поле ввода на единственную дату после выбора, поэтому пример возврата будет «Каждый 2-й, 10-й, 28-й каждый месяц».
  3. Любая другая библиотека, которая подходит в моем случае? 

YUI().use(
  'aui-datepicker',
  function(Y) {
    new Y.DatePicker({
      trigger: 'textarea',
      mask: '%m/%d/%y',
      calendar: {
        selectionMode: 'multiple'
      },
      popover: {
        zIndex: 1
      },
      panes: 1
    });
  });
<link href="http://cdn.alloyui.com/3.0.1/aui-css/css/bootstrap.min.css" rel="stylesheet" />
<script src="http://cdn.alloyui.com/3.0.1/aui/aui-min.js"></script>
<textarea class="form-control" type="text" placeholder="mm/dd/yy">09/07/18 — 09/08/18 — 09/19/18</textarea>

1 Ответ

0 голосов
/ 15 ноября 2018

Это выглядит многообещающе для ваших целей.см. демонстрационную ссылку ниже: 

var today = new Date();
var y = today.getFullYear();
$('#mdp-demo').multiDatesPicker({
addDates: ['10/14/'+y, '02/19/'+y, '01/14/'+y, '11/16/'+y],
numberOfMonths: [3,4],
defaultDate: '1/1/'+y
});

она соответствует вашим требованиям:

  • Как сделать множественный выбор без контроля нажатия?В настоящее время, если щелчок без элемента управления в другой день удалит все остальные дни.
  • Как изменить поле ввода на единственную дату после выбора, поэтому пример возврата будет «Каждый 2-й, 10-й, 28-й каждый месяц».// вам придется работать над этим.см. ссылку на документ ниже:

демонстрационная ссылка: http://dubrox.github.io/Multiple-Dates-Picker-for-jQuery-UI/#demo-full-year

...