Потрібен простий конструктор на HTML + JQURY
Є завдання зробити конструктор умов на фронті. Як приклад, є таке умова "if((action == true || action == true && val == 5) || (action == true && $val != 7) )" потрібно мати можливість повторити на фронтенді.
Як потрібно зробити.
При завантаженні з'являється форма, яка розділена на два блоки
1й блок "Умови"
1. Кнопка створити форму
2. Якщо це перший елемент на своєму рівні, то пусто, в іншому випадку селектор з && і || ("level_condition")
3. Селектор, який буде вибирати поле з доступних, які знаходяться в масиві title і name ("field_name")
[
{"name": "some_name", "title": "Some Name", "type": "select", "select_data": [{"name": 12, "value": 12}, {"name": 14, "value": 14}]},
{"name": "some_name_1", "title": "Some Name 1", "type": "boolean", "value": false},
{"name": "some_name_2", "title": "Some Name 2", "type": "integer", "value": 5},
{"name": "some_name_3", "title": "Some Name 3", "type": "string", "value": "string text"}
]
4. Селектор з логічними операціями != == і т.п. ("operation")
5. Поле для вказання значення вручну або ж, якщо це boolean select, то вказувати значення з масиву в пункті 3. ("value")
6. Кнопка додати саблевел, який має таку ж логіку, як і блок вище.
7. Кнопка видалення (якщо видаляється батьківський, то і все, що нижче, затирається)
Таким чином, ми зможемо повторити логіку з безкінечною вкладеністю.
2й блок "Дії"
Селектор з вибору "", "Помилка", "Дія".
Після вибору "Помилка" з'являється текстове поле для введення тексту
Після вибору "Дія" з'являється селектор, як у пункті 3, з можливістю додавання нових (тут без рівня) і кнопка видалення.
Кнопка збереження.
У формі потрібно правильно зробити вкладеність. Очікується, що при відправці на збереження структура відповіді буде такою. Якщо вибрати на 1м рівні 2 умови. У 1м умові вибрати 1 саб рівень і т. д.
conditions[0][level_condition] = ""
conditions[0][field_name]
conditions[0][operation]
conditions[0][value]
conditions[0][0][level_condition] = ""
conditions[0][0][field_name]
conditions[0][0][operation]
conditions[0][0][value]
conditions[0][1][level_condition] = "||"
conditions[0][1][field_name]
conditions[0][1][operation]
conditions[0][1][value]
conditions[1][level_condition]= "&&"
conditions[1][field_name]
conditions[1][operation]
conditions[1][value]
action_selector[error] = текст помилки
action_selector[0][action][field_name]= поле, яке вибрали
action_selector[0][action][value] = значення для поля, яке вибрали
Картинка з прикладом загальної концепції, тільки є зайві кнопки
Додатки 1
-
729 10 0 Юрій, добрий день.
Цікаве завдання, з радістю б зайнявся ним.
Цю задачу цілком можна вирішити і без JQuery, але якщо потрібно, то можу його використати.
-
680 7 0 Добрий день, можу виконати ваше замовлення. Варто підмітити, що таке завдання було б зручніше зробити на SvelteJS, проте без проблем зроблю і на jQuery. Також, є декілька питань, які я хотів би обговорити у приватних повідомленнях.
-
3698 111 3 5 Привіт, Юрію!
Готовий реалізувати завдання, використовуючи jQuery. Деталі можемо обговорити в особистих повідомленнях.
З повагою, Юрій
-
3838 44 0 Доброго дня, Юрію!
Я готовий реалізувати ваш проект з простим конструктором на HTML + jQuery. Давайте обговоримо проект більш детально
Актуальні фриланс-проєкти в категорії HTML та CSS верстання
Лендинг для Shopify-магазину за готовим макетомПотрібно розробити landing page для інтернет-магазину на Shopify. Магазин вже працює на купленій темі, тому завдання — адаптувати готовий візуальний макет і структуру під можливості поточної теми, без повної розробки з нуля. Сторінка потрібна під рекламний трафік з Facebook /… CMS, HTML та CSS верстання ∙ 11 годин 32 хвилини тому ∙ 21 ставка |
Додати блок на сайтДля сайта: https://queenstabledance.com/ Надо зробити блок контенту на двох мовних версіях - щоб він редагувався в адмінці. Приклад блоку нижче. HTML та CSS верстання ∙ 13 годин 11 хвилин тому ∙ 54 ставки |
Зібрати сторінку на Elementor ProНеобхідно зібрати з нуля сторінку на сайті WordPress на плагіні Elementor (Pro-версія). Десктоп версія + адаптивна версія планшет та мобайл. Дизайн надаємо у Figma. Шаблон документу дизайну — у вкладеннях (тільки десктоп версія). Необхідно буде використовувати анімацію, тому… HTML та CSS верстання, Веб-програмування ∙ 15 годин 49 хвилин тому ∙ 53 ставки |
Оновлення плагінів і тем WP сайт putevka.uz«Потрібно провести технічний аудит WordPress-сайту, перевірити актуальність, безпеку та сумісність встановлених плагінів і теми. За результатами — запропонувати легальні варіанти оновлення, заміни застарілих рішень або переходу на офіційно доступні аналоги. Платні плагіни та… HTML та CSS верстання, PHP ∙ 20 годин 38 хвилин тому ∙ 34 ставки |
Розробка інтерактивної карти Palworld для сайтуПотрібно розробити інтерактивну карту Palworld за прикладом: https://palworld.gg/map Нам потрібна не просто статична картинка, а повноцінна інтерактивна карта, де користувач може дивитися локації, вмикати / вимикати категорії об’єктів, шукати потрібні точки та взаємодіяти з… HTML та CSS верстання, Javascript та Typescript ∙ 1 день 11 годин тому ∙ 28 ставок |