Плагин Jquery Form не будет отправлен в рамках начальной загрузки - PullRequest
Новая
       23

Плагин Jquery Form не будет отправлен в рамках начальной загрузки

0 голосов
/ 28 января 2019

Я использую плагин Jquery Form для формы, которая загружается через ajax в модале начальной загрузки.Модальное тело загружается с помощью функции jquery .load (), и как только оно загружается, я выполняю функцию, которая связывает форму в модальном режиме с экземпляром плагина Jquery Form, используя .ajaxForm ().

Кажется, все работает, как и ожидалось, я не получаю ошибок в консоли, но когда я пытаюсь отправить форму, абсолютно ничего не происходит.Я не использую protectDefault (), поэтому теоретически форма будет отправляться нормально, если на нее не влияет плагин формы Jquery.Я потратил несколько часов, пытаясь решить эту проблему, и ничего не получил.Некоторая помощь будет принята с благодарностью.

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

ЗдесьHTML для формы: 

<form action="posts/new" method="post" class="html-snippet" id="section-45">
<div class="row">
    <fieldset>
        <section class="col col-md-12">
            <div class="form-group">
                <label><h4>Snippet Title</h4></label>
                <input type="text" name="title" placeholder="Snippet Title" class="form-control" value="">
            </div>
        </section>
    </fieldset>
    <fieldset>
        <section class="col col-md-12">
            <div class="form-group">
                <label><h3>HTML Content</h3></label><br />
                <textarea name="html" id="html-45"></textarea>
            </div>
        </section>
    </fieldset>
</div>
<div class="clearfix"></div>
<div class="modal-footer">
    <button type="reset" class="btn btn-default" data-dismiss="modal">
        Cancel
    </button>
    <button type="submit" id="publish-45" class="btn btn-primary">
        Publish HTML
    </button>
</div>

Вот javascript, который загружает модальное и модальное содержимое: 

            $('.configure-btn').on('click',function(){
               var id = $(this).closest('li').attr('id');
               var type = $("#" + id).attr("data-type");
               $('#popup').modal('show');
               $('.modal-content').load('/modals/sections', { 'section_id': id }, function( data ) {
                  $( ".modal-content" ).html( data );
                  loadEditor(id);
                  loadHtmlForm(id);                        
               });
            });

И, наконец, вот коддля функции loadHtmlForm (): 

function loadHtmlForm(id){
var options = {
    beforeSerialize: function(form, options) { 
        for(instance in CKEDITOR.instances){
            CKEDITOR.instances[instance].updateElement();
        }
    },
    beforeSubmit: function validate(formData, jqForm, options) { 
        var titleValue = $('input[name=title]').fieldValue(); 
        var htmlValue = $('input[name=html]').fieldValue(); 
        if (!titleValue[0] || !htmlValue[0]) { 
            swal({
                title: "Form not complete!",
                text: "You cannot submit the form without filling in the fields, playa!",
                icon: "error",
                timer:1800
            });
            return false; 
        } 
        return true;
    },
    success: function() {
        swal({
            title: "Perfect!",
            text: "You created a new section!",
            icon: "success",
            timer:1800
        });
        $('#popup').modal('toggle');
    }
};
$("#section-" + id).ajaxForm(options);

}

В любой точке этой функции (кроме функции успеха) я могу добавить alert () или console.log () иубедитесь, что он стреляет надлежащим образом.Но нет никаких признаков того, что форма фактически даже пытается отправить, когда вы нажимаете кнопку отправки.Ничего не происходит вообще.

...