Nano Hash - криптовалюты, майнинг, программирование

Правило формы Semantic-ui, только если выбрана опция

Я использую семантический интерфейс и пытаюсь выполнить с ним проверку формы.

В моем сценарии у пользователя есть 2 варианта: электронная почта или проверка приложения по телефону. Они выбирают один из вариантов и вводят что угодно в текстовое поле, а затем нажимают «Отправить».

Однако я не уверен, как сделать это с помощью семантического пользовательского интерфейса.

Я знаю, что если бы я хотел проверить, было ли оно пустым, я мог бы сделать что-то вроде этого:

$('.ui.form')
  .form({
    fields: {
      CODE: {
        identifier: 'code',
        rules: [
          {
            type   : 'empty',
            prompt : 'Please enter your verification code'
          }
        ]
      }  
    } } );

Однако мне нужны дополнительные правила, в зависимости от того, какой вариант выбран. У меня есть javascript, который в настоящее время сообщает мне значение того, что выбрано, и обновляется при изменении. Не знаю, как добавить его в правила, чтобы я мог быть похожим: если был выбран телефон, он должен состоять ровно из 6 символов, или ЕСЛИ было выбрано электронное письмо, должно быть 18 символов (разная длина для разных вариантов).

Есть ли способ иметь такие условные правила? Шкаф, который мне удалось найти, был:

depends: 'id'

Которая проверяет, не пусто ли оно.

Кто-нибудь знает, как иметь такие условные правила, как это, на основе другого элемента формы? Я использую самую последнюю версию Semantic-UI

validation semantic-ui
28.02.2019

Ответы:


1

Вы можете сделать это, добавив собственные правила.

$.fn.form.settings.rules.atLeastOne = function (value, fields) {
    fieldsToCompare = fields.split(",")
    if (value) {
        // current input is not empty
        return true
    } else {
        // check the other input field(s)
        // atLeastOne is not empty
        atLeastOne = false
        for (i = 0; i < fieldsToCompare.length; i++) {
            // gets input based on id
            if ($("#" + fieldsToCompare[i]).val()) {
                atLeastOne = true
            }
        }
        return atLeastOne
    }
}

$(".ui.form").form({
    fields: {
        number:{
            identifier: "number",
            rules: [{
                type: "exactLength[6]",
                prompt: "number has to be 6 chars long"
            }, {
                // include the input fields to check atLeastOne[email, address, ...]
                type: "atLeastOne[email]",
                prompt: "Please provide an email or a number"
            }]
        },
        email: {
            identifier: "email",
            rules: [{
                type: "exactLength[18]",
                prompt: "email has to be 18 chars long"
            }, {
                type: "atLeastOne[number]",
                prompt: "Please provide an email or a number"
            }]
        }
    }
});

Обратите внимание, что функция использует идентификатор входа в качестве идентификатора, а не имя входа. Вы также можете изучить необязательные поля.

28.02.2019
Новые материалы
Кластеризация: более глубокий взгляд
Кластеризация — это метод обучения без учителя, в котором мы пытаемся найти группы в наборе данных на основе некоторых известных или неизвестных свойств, которые могут существовать. Независимо от..
Как написать эффективное резюме
Предложения по дизайну и макету, чтобы представить себя профессионально Вам не позвонили на собеседование после того, как вы несколько раз подали заявку на работу своей мечты? У вас может..
Частный метод Python: улучшение инкапсуляции и безопасности
Введение Python — универсальный и мощный язык программирования, известный своей простотой и удобством использования. Одной из ключевых особенностей, отличающих Python от других языков, является..
Как я автоматизирую тестирование с помощью Jest
Шутка для победы, когда дело касается автоматизации тестирования Одной очень важной частью разработки программного обеспечения является автоматизация тестирования, поскольку она создает..
Работа с векторными символическими архитектурами, часть 4 (искусственный интеллект)
Hyperseed: неконтролируемое обучение с векторными символическими архитектурами (arXiv) Автор: Евгений Осипов , Сачин Кахавала , Диланта Хапутантри , Тимал Кемпития , Дасвин Де Сильва ,..
Понимание расстояния Вассерштейна: мощная метрика в машинном обучении
В обширной области машинного обучения часто возникает необходимость сравнивать и измерять различия между распределениями вероятностей. Традиционные метрики расстояния, такие как евклидово..
Обеспечение масштабируемости LLM: облачный анализ с помощью AWS Fargate и Copilot
В динамичной области искусственного интеллекта все большее распространение получают модели больших языков (LLM). Они жизненно важны для различных приложений, таких как интеллектуальные..