Select

const alert_opts = [
    { key: 1, label: 'None' },
    { key: 2, label: 'On start date' },
    { key: 3, label: '1 day before' }
];
            
scheduler.locale.labels.section_select = 'Alert';

scheduler.config.lightbox.sections = [
    { name:"text", height:50, map_to:"text", type:"textarea", focus:true },
    { name:"select", height:40, map_to:"type", type:"select", options:alert_opts},
    { name:"time", height:72, type:"time", map_to:"auto"}
];

Основной редактор выбора во lightbox

Инициализация

Чтобы добавить элемент управления Select в lightbox, выполните следующие шаги:

1. Добавьте секцию в конфигурацию lightbox:

scheduler.config.lightbox.sections = [
    { name:"description", ... },
    { name:"alert", height:40,map_to:"type",type:"select", options:alert_opts},
    { name:"time", ...}
];

2. Установите ярлык для секции:

scheduler.locale.labels.section_select = "Alert";

Основной редактор выбора во lightbox

Свойства

Следующие свойства в основном важны и обычно задаются для элемента управления 'select' (полный список см. здесь):

name	(string) имя секции
height	(number) высота секции
map_to	(string) имя свойства данных, которое будет сопоставлено секции
type	(textarea,time,select,template,multiselect,radio,checkbox,combo) тип элемента управления секции
options	(array of objects) определяет варианты выбора элемента управления (для контролов 'select', 'multiselect', 'radio', 'combo'). Каждый объект в массиве задаёт один вариант и имеет следующие свойства: key - (string) идентификатор варианта. Это свойство сравнивается со свойством данных события для назначения опций события label - (string) ярлык варианта
onchange	(function) задаёт функцию обработчика события 'onchange' для элемента управления секции Linking select controls in the lightbox

Заполнение элемента управления данными

Обычно, чтобы задать значения для элемента управления Select, следует использовать параметр options:

scheduler.config.lightbox.sections = [
    {      name:"alert", type:"select", 
        ...
        options:[
            { key: 1, label: 'None'},
            { key: 2, label: 'On start date'},
            { key: 3, label: '1 day before'}
    ]},
    ...
];

Элементы в параметре options должны иметь 2 обязательных свойства:

• key - идентификатор варианта
• label - ярлык варианта

Изменение опций динамически

Чтобы заполнить элемент управления данными с сервера, задайте параметр options значением, возвращаемым методом serverList:

scheduler.config.lightbox.sections = [
    {name:"description", ...},
    {name:"type",map_to:"type",type:"select",options:scheduler.serverList("type")},
    {name:"time", ...}
];

scheduler.load("/api/types");

примечание

Подробности о методе serverList приведены в соответствующей статье.

Данные ответа для метода load должны содержать коллекцию с именем списка сервера, указанным в JSON из следующего формата:

{ 
   "data":[
      {
          "id":"1",
          "start_date":"2027-03-02 15:00:00",
          "end_date":"2027-03-04 16:00:00",
          "text":"Interview",
          "type":"1"
      },
      {
          "id":"2",
          "start_date":"2027-03-02 17:00:00",
          "end_date":"2027-03-04 18:00:00",
          "text":"Performance review",
          "type":"2"
      }
   ], 
   "collections": {/*!*/
      "type":[/*!*/      
         {"value":"1","label":"Interview"},/*!*/
         {"value":"2","label":"Performance review"},/*!*/
         {"value":"3","label":"Request"}/*!*/
      ]/*!*/
   }/*!*/
}

Метод parse можно также использовать, если нужно загрузить опции после инициализации планировщика.

Если нужно обновить указанные опции элемента управления новыми, можно использовать метод updateCollection:

scheduler.updateCollection("type", [      
    {"key":"1","label":"Interview"},
    {"key":"2","label":"Performance review"},
    {"key":"3","label":"Request"}
]);

Подробности смотрите в статье scheduler.serverList.