JQuery-подтверждение содержимого диалога не обновляется при изменении формы

В настоящее время у меня возникла проблема с плагином jquery-verify, когда я не могу динамически изменять содержимое.

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

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

Вот код, который я использую

 $(document).ready(function() {
        $(".confirm").confirm({
            title: 'Submit the Form?',
            content: 'Form Select Value:' + $("#formSelect option:selected").text() +' <br />  Form Input Value: '+  $("#formInput").val() +' <br /> ',
            buttons: {
                formSubmit: {
                    text: 'Submit',
                    action: function () {
                        $('#myForm').submit();
                    }
                },
                cancel: function () {
                    //close
                }
            }

        }); 
});

Проблема в том, что независимо от того, какие обновления я делаю для ввода формы, эти изменения не отображаются внутри содержимого jquery-Подтверждения. Содержимое всегда отображает начальное состояние формы ввода.

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

Может кто-нибудь показать мне, как правильно связать значения формы в содержание JQuery-подтверждения?

РЕДАКТИРОВАТЬ: (включая упрощенную версию формы HTML)

  <form id="myForm"  method="post" action="/processThisForm" >
      <select id="formSelect" name="formSelect" >
         <option value="1">1</option>
         <option value="2">2</option>
         <option value="3">3</option>
      </select>
      <input type="text" id="formInput" />
      <button class="confirm">Save</button>
   </form>

РЕДАКТИРОВАТЬ 2:

Создал jsfiddle для этого кода

https://jsfiddle.net/uxfb8myp/2/

1 ответ

Решение

Обновите свой content назначение поля с function как ниже.

content: function() { 
    return 'Form Select Value:' + $("#formSelect option:selected").text() +' <br />  Form Input Value: '+  $("#formInput").val() +' <br /> '
},

Ваш полный $(".confirm").confirm() должно быть как ниже.

$(document).ready(function() {
    $(".confirm").confirm({
        title: 'Submit the Form?',
        content: function() { 
            return 'Form Select Value:' + $("#formSelect option:selected").text() +' <br />  Form Input Value: '+  $("#formInput").val() +' <br /> '
        },
        buttons: {
            formSubmit: {
                text: 'Submit',
                action: function () {
                    $('#myForm').submit();
                }
            },
            cancel: function () {
                //close
            }
        }
    }); 
});
Другие вопросы по тегам