Компонент Edit Grid

🌐 Цей документ доступний українською та англійською мовами. Використовуйте перемикач у правому верхньому куті, щоб змінити версію.

1. Опис компонента

Компонент Edit Grid є потужним інструментом для роботи з таблицями у формах і дозволяє динамічно додавати, редагувати та видаляти рядки з таблиці. Це поле відображається у формі як таблиця, яка містить дані, які користувачі можуть редагувати. Компонент дозволяє вам налаштувати відображення, валідацію та інші опції для кожного рядка.

Розширення стандартного компонента Edit Grid включає додавання додаткових опцій, які спрощують моделювання. Це дозволяє розробникам та моделювальникам регламенту використовувати цей компонент більш гнучко та підлаштувати його під специфічні потреби різноманітних бізнес-сценаріїв.

Використовуйте Edit Grid з переліку Оновлених компонентів.

2. Основні функції

Компонент Edit Grid підтримує велику кількість опцій для застосування при взаємодії із формою процесу, які розподілені за вкладками.

  • Display

  • Data

  • Validation

  • API

  • Logic

  • Label: назва компонента, яка відображається поряд з ним.

  • Label Position: визначає положення мітки відносно компонента (верх, праворуч, зліва, або внизу).

  • Description: опис компонента, який може допомогти користувачам зрозуміти його призначення.

  • Tooltip: текст, який відображається при наведенні курсора на компонент.

  • Quick Search: дозволяє користувачам швидко знаходити записи в таблиці, використовуючи простий пошуковий фільтр.

  • Hidden: поля, які приховані від користувача, але все ще є частинами форми й будуть передані при відправленні форми.

  • Multiple-record selection: дозволяє користувачам вибирати кілька записів в таблиці одночасно.

  • Read Only: показує дані через окремий елемент управління в контекстному меню (три вертикальних крапки), який дозволяє переглядати дані без можливості редагування.

  • Redraw On: перемальовує компонент, якщо інший компонент змінюється.

  • Clear value when hidden: коли значення приховане, очищує значення.

  • Validate On: визначає, коли цей компонент повинен активувати валідацію на клієнті (опції Зміна або Розмиття).

  • Required: поле обов’язкове для заповнення перед відправленням форми.

  • Minimum length: мінімальна кількість символів, які користувач повинен ввести.

  • Maximum length: максимальна кількість символів, які користувач може ввести.

  • Custom error message: спеціальне повідомлення про помилку, яке відображається, коли дані не проходять валідацію.

  • Custom validation: власна валідація, яка дозволяє вам створити специфічні для ваших потреб перевірки на валідність.

  • Property name: ім’я цього поля для API-ендпоінту, яке відповідає назві таблиці у базі даних реєстру. Наприклад, licences.

  • Advanced Logic: в контексті компонентів веб-форм означає більш складні та гнучкі умови і правила, які можна встановити для взаємодії елементів форми між собою. означає, що можна налаштовувати не тільки прості відображення чи приховування полів на основі одного-двох умов, але й створювати більш складні логічні вирази, які реагують на різні стани та вхідні дані.

    • Logic Name: назва логічного блоку або умови, яку ви встановлюєте. Вона використовується для ідентифікації цієї конкретної логіки або умови в межах вашої форми.

    • Trigger: умова або подія, яка викликає виконання екшену (дії). Тригер може бути будь-яким станом форми (наприклад, значенням певного поля) або подією (наприклад, подія "клік" чи "введення" в конкретному полі).

      • Type: параметр, який вказує, який тип логіки ви використовуєте. Simple: проста логіка, де ви вказуєте одну умову або правило для тригера. Javascript: логіка з використовуванням JavaScript код для складніших умов та правил. Детальніше див. Змінні у JS-вставках.

      • When the form component: вказує на те, коли ця логіка або умова буде застосована. Відображається для типу Simple.

      • Has the value: вказує на конкретне значення, яке ви очікуєте від компонента форми для виконання цієї умови чи тригера. Відображається для типу Simple.

    • Action: дія, яка виконується, коли відбувається тригер. Екшин може бути різними діями над формою.

      • Action Name: назва для ідентифікації цієї конкретної дії в межах вашої форми.

      • Type: тип дії, яку ви хочете виконати. Доступно Property (вказує на конкретну властивість компонента форми, яку ви хочете змінити.)

      • Component Property: вказує на конкретну властивість компонента форми, яку ви хочете змінити. Відображається для типу Property. Disabled: заблокований стан компонента. Можливо встановити true або false.

  • Record Actions: дії, які можна виконати із записами в таблиці (максимальна кількість дій — 5). Наприклад, можна змінити дату терміну дії ліцензії (Action: _action_update) або анулювати ліцензію (Action: _action_cancel) тощо.

3. Формат даних

Компонент приймає масив об’єктів. Кожен об’єкт у масиві може містити різні поля та їх значення. У прикладі нижче наведено один об’єкт з полем "textfield" та значенням 'test'.

Submission
Array<Object>
// Приклад: [ { textfield: 'test' } ]