Проверка Jquery в модальном режиме Bootstrap не работает должным образом

Я хочу загрузить страницу формы URL (удаленно) в модальную, и она работает хорошо. Но проверка jquery в загруженной форме работает только один раз. Когда я снова загрузил форму, проверка jquery не выполняется, за исключением обновления страницы. Зачем быть таким. Что не так в моем коде.

<script type="text/javascript">
$(document).ready(function(){
     $('[data-toggle="modal"]').click(function() {
        var url = $(this).attr('href').replace(/\s/g,"+");
        if (url.indexOf('#') == 0) {
            $(url).modal('open');
        }else {
            $.get(url, function(data) {
                $(data).modal();
            }).success(function() {
                $('input:text:visible:first').focus();
                $("#frmAddMcb").validate({
                    submitHandler: function(form){
                        $('#modalAddMcb').modal('hide');
                        return postForm(form, "savemcb", "Body", "listmcb", false, false);
                    }
                });
            });
        }
    });
});
</script>
<div class="row-fluid">
<a href="addmcb" data-toggle="modal" class="btn btn-warning btn-xs link_href" title="Add MCB">Add MCB</a>

addmcb вернуть эту форму

<div id="modalAddMcb" class="modal">
<div class="modal-dialogg">
    <div class="modal-content">
        <div class="modal-header">
            <button aria-hidden="true" data-dismiss="modal" class="close" type="button">×</button>
            <h4 class="modal-title">Add MCB</h4>
        </div>
        <div class="modal-body">
            <form id="frmAddMcb" enctype="multipart/form-data" class="form-horizontal" novalidate>
                <div class="form-group">
                    <label class="col-md-2 col-sm-2 control-label">Name *</label>
                    <div class="col-md-9">
                        <input type="text" name="mcb.name" class="form-control" value='<s:property value="%{mcb.name}"/>' required>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-md-2 col-sm-2 control-label">Image *</label>
                    <div class="col-md-9">
                        <input type="file" name="fileUploaded" class="form-control">
                    </div>
                </div>
                <div class="modal-footer">
                    <button data-dismiss="modal" class="btn btn-default" type="button">Cancel</button>
                    <button class="btn btn-primary" id="submit" type="submit"> Save</button>
                </div>
            </form>
        </div>
    </div>
</div>


person Mahadi Siregar    schedule 21.04.2014    source источник
comment
У меня похожая проблема, но решения пока нет.   -  person plocks    schedule 19.08.2014


Ответы (1)


Проверка jquery не работает, когда вы снова загружаете модальное окно, потому что ваш код проверки $("#frmAddMcb").validate({..}) в событии document.ready() не запускается снова ( потому что страница уже загружена), в то время как вам нужно это для проверки вашей формы.

Чтобы решить эту проблему, вы можете добавить свой код проверки в событие загрузки модального окна, чтобы убедиться, что оно запускается каждый раз, когда вы загружаете модальное окно:

$('.modal').on('loaded.bs.modal', function (e) {
  // your validation code
})
person PhucVD    schedule 28.10.2015