通过引导标签验证ajax生成的内容

我有一个选项卡设置，其中每个选项卡的内容通过ajax加载。 #tab1是静态的 - 并且经过验证的表单的工作原理与通过页面加载时运行的$(".validate").validate()一样。但tab2有相同的形式 - 它并没有得到验证。我假设它是因为调用初始函数时第二种形式不存在。，但即使我在运行ajax时再次调用validate()函数 - 即使这样，表单也不会被验证。通过引导标签验证ajax生成的内容

HTML：

<div class="tabbable"> 
<ul class="nav nav-tabs"> 
    <li class="active"><a href="#tab1" data-toggle="tab">Personal Details</a></li> 
    <li><a href="test-content.html" class="ajax" data-toggle="tab">Finances</a></li> 
</ul> 
<div class="tab-content"> 
    <div class="tab-pane active" id="tab1"> 
      <form name="ftblPaymentsadd" id="ftblPaymentsadd" action="#" method="post" enctype="multipart/form-data" class="validate" > 
      <input type="text" name="sss" class="required"> 
      <input type="submit" value="go"> 
      </form> 
    </div> 
    <div class="tab-pane active" id="tab2"> 
     <!-- content will be loaded via ajax --> 
    </div> 
</div> 
</div>

内容来自text-content.html来：

<form name="ftblPaymentsaddww" id="ftblPaymentsaddww" action="#2" method="post" enctype="multipart/form-data" class="validate" > 
<input type="text" name="ssswwws" class="required"> 
<input type="submit" value="go"> 
</form>

JS：

$('.nav-tabs .ajax').click(function (e) { 
     var thisTab = e.target // activated tab 
     var pageTarget = $(thisTab).attr('href'); 
     var itemNumber = $(this).parent().index()+1; 
     $('.tab-pane').removeClass('active'); 
     $("#tab"+itemNumber).html('loading...'); 
     $("#tab"+itemNumber).load(pageTarget,function(){ 
      $(".validate").validate(); 
     }).addClass('active'); 
});

来源

2014-11-05 kneidels

你是否将任何规则添加到'.validate（）'？如果在DOM准备就绪时添加它们，则必须在完成ajax后重新添加它们。 – Spokey 2014-11-05 15:46:35

未添加任何规则。我认为再次调用validate（）就足够了。你能否进一步解释一下要添加什么，以及在哪里？ – kneidels 2014-11-05 15:49:14

当你调用$(".validate").validate()，你只是在页面上初始化第一个发生的.validate类的插件。 This is a limitation of the plugin，而不是jQuery。

一种解决方法是包裹.validate()方法的.each()内...

$(".validate").each(function() { 
    $(this).validate(); 
});

但是，如果所有的形式时，它被称为已经存在只会工作。您正试图以完全不同的新创建表单第二次致电.validate()。通常这会工作，但在你的情况下，它会失败，因为你再次使用相同的jQuery类选择器（请参阅上面的问题）。此外，.validate()不能被调用多次在相同的形式（S）...所有后续调用被忽略。

做的最好的事情是分配一个唯一id给每个窗体以便您可以单独调用.validate()方法，你需要初始化每一个插件。

来源

2014-11-05 16:28:01 Sparky

了解。谢谢你的耐心！在这里我想我是如此聪明地使用类而不是ID;） – kneidels 2014-11-05 16:40:16

通过引导标签验证ajax生成的内容

回答

相关问题