Семантический интерфейс onSuccess, обратные вызовы onFailure не запускаются при проверке формы

В следующем коде, который проверяет, что это имя пользователя имеет значение и совпадают пароли, ни обратный вызов onSuccess, ни обратный вызов onFailure никогда не запускаются, даже если правила проверки выполняются / применяются. Я тестировал все остальные части этого независимо, и этот макет в точности соответствует документации, поэтому я исключил синтаксические ошибки. В дополнение к синтаксису, используемому ниже, я также попробовал формат $ (). Form (). OnSuccess (). OnFailure (), но получил ошибку «Uncaught TypeError: onSuccess не является функцией». Скрипка здесь: Семантический интерфейс onSuccess, пример обратного вызова onFailure.

$(function(){
    $('#main')
        .form({
            on: 'blur',
            fields: {
                username: {
                    identifier : 'username',
                    rules: [
                        {
                            type : 'empty'
                        }
                    ]
                },
                password1: {
                    identifier  : 'password1',
                    rules: [
                        {
                            type   : 'match[password2]',
                            prompt : 'Please enter the same value in both fields'
                        }
                    ]
                },
                password2: {
                    identifier  : 'password2',
                    rules: [
                        {
                            type   : 'match[password1]',
                            prompt : 'Please enter the same value in both fields'
                        }
                    ]
                }
            },
            onSuccess: function() {
                $(".ui.button[name='account']").removeClass('disabled');
                console.log('Success');
            },
            onFailure: function() {
                $(".ui.button[name='account']").addClass('disabled');
                console.log('Failure');
            }
        }
    );
});

javascript semantic-ui
person Dan Swain    schedule 09.02.2016    source источник
comment
Я только что обновил код jsfiddle jsfiddle.net/6y7w57xv/3   -  person Shoaib Nawaz    schedule 08.03.2016

Ответы (2)


arrow_upward
2
arrow_downward

Ключ в том, чтобы называть это так. $('#main').form(fieldRules, settings); onFailure и onSuccess прописаны в настройках.

Взгляните на исправленный код:

    $(function(){
        $('#main')
            .form({
                    username: {
                        identifier : 'username',
                        rules: [
                            {
                                type : 'empty'
                            }
                        ]
                    },
                    password1: {
                        identifier  : 'password1',
                        rules: [
                                {
                                    type: 'empty',
                              prompt: 'Please enter the password'
                                },
                            {
                                type   : 'match[password2]',
                                prompt : 'Please enter the same value in both fields'
                            }
                        ]
                    },
                    password2: {
                        identifier  : 'password2',
                        rules: [
                            {
                                type   : 'match[password1]',
                                prompt : 'Please enter the same value in both fields'
                            }
                        ]
                    }
                }, {
                    on: 'blur',
                  inline: true,
                  onSuccess: function() {
                    alert('Success');
                    return false; // false is required if you do don't want to let it submit

                    },
                    onFailure: function() {
                    alert('Failure');
                    return false; // false is required if you do don't want to let it submit                                            
                    }
                  });
    });
person Shoaib Nawaz    schedule 08.03.2016
comment
Это вообще не работает - проверка даже не выполняется. Плюс размещение on и inline в первом объекте работает нормально, так почему бы не onSuccess и onFailure? Я убедился, что снял обертку fields: {} с первого объекта, но по-прежнему ничего не происходит. - person ; 23.07.2017
comment
Ага! По крайней мере, в последних версиях (2.2.x) вы не используете второй объект настроек. OP на самом деле уже имеет правильный код - проблема в том, что это неинтуитивное поведение с обратными вызовами onSuccess и onFailure, особенно в моем случае, когда я работаю с формой с одним полем. Они не вызываются по завершении проверки на основе метода on. то есть: on: 'blur' или on: 'change' не означает, что onSuccess будет вызываться, как только будет проверено последнее поле. Вы должны отправить форму или, в случае формы с одним полем, вместо этого использовать событие onValid. - person ; 23.07.2017

arrow_upward
0
arrow_downward

Я тоже столкнулся с этой проблемой. Я все перепробовал, единственный способ onSuccess to fire заключался в следующем:

  const formValidated = $('.ui.form').form(
     {
        fields: {
           name: {
              identifier: 'name',
              rules: [ 
                 {
                    type   : 'empty',
                    prompt : 'Please enter a name for the camera'
                 }
              ]
           },
        }
     }
  )

  if ($(formValidated).form('is valid')) {
     this.handleSave();
  } else {
     return false;
  }
person stevenlacerda    schedule 07.08.2017