Jquery Form Plugin Won't Submit Within Bootstrap Modal

Question

I'm using the Jquery Form Plugin on a form that is being loaded via ajax within a bootstrap modal. The modal body is being loaded via jquery's .load() function, and once it is loaded I am executing a function that binds the form within the modal to an instance of Jquery Form Plugin using .ajaxForm().

Everything seems to be working as expected, I get no errors within the console, but when I try to submit the form, absolutely nothing happens. I'm not using preventDefault() so theoretically the form would submit normally if it wasn't being effected by Jquery Form Plugin. I've spent a few hours trying to troubleshoot this and I've gotten nowhere. Some help would be greatly appreciated.

Sidenote: I'm also using CKeditor on this form and loading it via a function that fires once the modal is loaded, but it's working fine.

Here is the html for the form:

<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>

Here is the javascript that loads the modal & modal content:

            $('.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);                        
               });
            });

And finally, here is the code for the loadHtmlForm() function:

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);

}

At any point within this function (other than the success function) I can add an alert() or console.log() and verify that it is firing appropriately. But there is no indication that the form is actually even attempting to submit when you press the submit button. Nothing happens at all.