2014-04-21 113 views
3

我想URL表单页面(远程)装入模式,它工作得很好。但jquery验证表单加载只是一次工作。当我再次加载的形式,不执行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> 

+0

我有一个类似的问题,但不要有一个解决方案呢。 – plocks

回答

0

jQuery的验证不起作用当你再次加载模式,因为您的验证码$( “#frmAddMcb”)。验证({ ..}) in document.ready()事件不会再次运行(因为页面已经加载),而您需要这个来验证您的表单。

为了解决这个问题,您可以将您的验证码为模式的Load事件,以确保它运行在您每次加载模式:

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