Как поместить обратный вызов в прослушиватель события submit формы для ожидания ответа пользователя на запрос импровизатора jquery?

Question

Вот что я хочу сделать -

• Отображать подсказку (используя экспромт jquery), когда пользователь нажимает кнопку отправки главной формы.Приглашение снова представляет собой форму с полем для пароля и кнопкой «ОК» и «Отмена».
• Основная форма (вместе со значением пароля, добавленным к основной форме) публикуется, когда пользователь нажимает кнопку «ОК».
• Форма не отправляется, если пользователь нажимает кнопку Отмена.

Подробности
Я задавал вопрос ранее - Форма запроса jQuery submit ()не работал внутри функции обратного вызова после предотвращения нормальной отправки при использовании импровизированной

и был в состоянии успешно реализовать то, что я хотел, используя собственный метод подсказки javascript.Но я хочу сделать то же самое, используя плагин импровизированной jquery.

Вот рабочий код с использованием нативной подсказки javascript -

$('#frmAddAdnetworkTemplate').submit(function(event){


            promptText = "Password required";

            postedPassword = prompt(promptText);

            if(postedPassword)
            {
                       $("form#frmAddAdnetworkTemplate").find("input#manage_adnetwork_password").val(postedPassword);
            }
            else
            {
                event.preventDefault();

            }
        });

А вот код, который я до сих пор использовал с помощью экспромта -

    $('#frmAddAdnetworkTemplate').submit(callBackSubmit);

    function callBackSubmit(event){

                $.prompt(passwordForm,{ buttons: { Ok: true, Cancel: function(){event.preventDefault(); } }, submit: submitPasswordPrompt});    

                //how do I call event.preventDefault(); when user cancel’s. 
    //The form gets submitted anayway, it does not wait for the code inside submitPasswordPrompt() to execute. How do I put some callback and make the submit event listener to wait until the user clicks Ok or Cancel?



            }

            function submitPasswordPrompt(e, value,m,form)
            {
                if(value)
                {

                     $("form#frmAddAdnetworkTemplate").find("input#manage_adnetwork_password").val(postedPassword);
    //append the password value in the main form 

                }
            }

Но форма все равно отправляется, и я не уверен, как сделать какой-то обратный вызов, чтобы предотвратить отправку, пока не ответит на импровизированный запрос.Это не ждет, как в случае наивного подсказки javascript.

Кроме того, обратите внимание, что я уже пытался использовать event.preventDefault в начале и form.submit () позже в моем предыдущем вопросе jquery submit () не работает внутри функции обратного вызова после предотвращения нормальной отправки в то время какиспользуя экспромт .Но в этом случае форма просто не отправляется (ошибка JavaScript не отображается).Пожалуйста, посмотрите, можете ли вы ответить на это.

Answer 1

Первое, на что нужно обратить внимание, это то, что вы назвали свой submit button «отправить».Это соответствует form.submit и делает невозможным отправку form.

Наиболее распространенная ошибка, допущенная при определении формы HTML, с которой будет взаимодействовать сценарий, следует из наличия средств доступа к ярлыкам.для контроля формы.Он должен дать элементу управления имя (или, возможно, идентификатор), которое соответствует существующему свойству элементов FORM.И наиболее распространенным примером этого является элемент INPUT типа = "submit" с ИМЯ "submit".Поскольку именованные элементы управления становятся доступными в качестве именованных свойств элемента FORM, этот элемент INPUT доступен под именем свойства «submit».К сожалению, элементы FORM уже имеют свойство с именем «submit», это метод submit, который можно использовать для отправки формы с помощью скрипта.

Источник: https://stackoverflow.com/a/3553600/896341

Вы даже используете плагин Экспромт неправильно и не должны передавать анонимные функции в качестве значений кнопок.Также обратите внимание, что функция submit event handler завершается до того, как функция submit callback в $.prompt().

Этот пример демонстрирует ход выполнения и то, как вы можете предотвратить отправку form.

$('#myForm').on('submit', function(event) {

    var promptText = "The form will be submitted, continue?";

    console.log('Blocking attempt to submit form using preventDefault().'); // DEBUG
    event.preventDefault(); // Prevent default submit

    $.prompt(promptText, {
        buttons : { // Specify buttons and their return value
            Ok: true,
            Cancel: false
        },
        submit: function(event, value, message, formVals) {
            //console.log('submit', event, value, message, formVals); // DEBUG
            if (value) {
                console.log('Unbind submit event handler and trigger a submit.'); // DEBUG
                // Notice that you might want to rebind the event later on.
                $('#myForm').off('submit').submit(); // Submit form
            }
        }
    });

    console.log('This is executed before the submit callback of $.prompt().'); // DEBUG
});

Answer 2

Я думаю, что вы пытаетесь предотвратить действие по умолчанию слишком рано.С вашим кодом вы нажимаете кнопку «Отмена» - предотвращение действия по умолчанию, а затем отправка на submitPasswordPrompt.Почему бы не попробовать отправить false для отмены, а затем выполнить логику protectDefault в функции отправки следующим образом:

$(function(){
                $('#passwordForm').submit(function(){

                    $.prompt('blah blah',{ buttons: { Ok: true, Cancel:false }, submit: submitPasswordPrompt});    

                    console.log('submitted');
                    return false; // Prevent submit
                });
            });

            function submitPasswordPrompt(e, value,m,form)
            {
                if(value)
                {
                     console.log('submittin....');
                } else {
                    console.log('its false');
                    e.preventDefault();
                }
            }

Answer 3

Я не знаю плагин, но знаю, что это замена HTML для браузера.

Я не собираюсь переписывать ваш код, но вижу, где можно изменить логику процесса, чтобы вам было легче.

Удалите весь код, который у вас есть в обработчике отправки формы.

Свяжите обработчик кликов с кнопкой отправки формы и предотвратите дефолт на кнопке, чтобы форма не отправлялась до тех пор, пока вы не сообщите ее.

В логике плагина, если все в порядке, когда пользователь нажимает «ОК», позвоните $('#frmAddAdnetworkTemplate').submit()

Если не «ОК», вам нужно самим разобраться с тем, что нужно сделать, используя методы плагина.