BootstrapValidator動的にリセットフォーム

Question

動的に生成される（jQuery）ダイアログのドメイン名またはIPアドレスを入力するためのフォームを（複数インスタンスで）含めています。最初のものはバリデータをトリガしますが、その後のものはそうではありません。バリデータの設定は次のように大まかに見える：

フィールドのバリデータは期待通りに動作しますが、その後の「対話」の最初の対話で

function domainNamesPage(e){ 
    getHTML('spf-tool', 'spf4'); 
    nextButton.innerHTML = '<button class="btn">Next</button>'; 
    $(".form_blocks:last-child").after(addButton); 
    $("#domainName").after(nextButton); 
    $('#domainName').formValidation({ 
    framework: 'bootstrap', 
    icon: { 
      valid: 'glyphicon glyphicon-ok', 
      invalid: 'glyphicon glyphicon-remove', 
      validating: 'glyphicon glyphicon-refresh' 
    }, 
    fields: { 
     server: { 
      validators: { 
       callback: { 
        message: 'The address is not valid', 
        callback: function(value, validator, $field) { 

          if (pass !== me) { 
           // error_object 
          } 
           return true; 
          } 
         } 
        } 
       } 
      } 
    }); 
} 

どんな反応を持っていないようです。

$("form").each(function() { 
     console.log(this); 
}); 

このような最初のルックス：この順序でロード

<form id="domainName" class="dmarc_form fv-form fv-form-bootstrap" autocomplete="on" action="" method="" novalidate="novalidate"> 

依存関係：

<form id="domainName" class="dmarc_form" autocomplete="on" action="" method=""> 

その後、このようなform要素自体を検討する際に

https://ajax.googleapis.com/ajax/libs/jquery/1.12.1/jquery.min.js 
https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css 
https://formvalidation.io/vendor/formvalidation/css/formValidation.min.css 
https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css 
https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js 
https://formvalidation.io/vendor/formvalidation/js/formValidation.min.js 
https://formvalidation.io/vendor/formvalidation/js/framework/bootstrap.min.js 
https://use.fontawesome.com/b66d6d44ad.js 
https://cdn.fontawesome.com:443/js/stats.js 
https://use.fontawesome.com/b66d6d44ad.css" media="all 

とHTMLは、基本的には、次のとおりです。私は何をしないのです

$('#domainName').removeClass('fv-form-bootstrap'); 
$('#domainName').removeClass('fv-form'); 
$('#domainName').removeAttr('novalidate'); 
$('#domainName').data('formValidation').resetForm(); 

：$('#domainName').data('formValidation').resetForm();に加えて

<form id="domainName" autocomplete="on" action="" method=""> 
    <div id="formGroup" class="form-group has-feedback"> 
     <div class="input_validate_box"> 
      <input class="form-control input_text bold" name="server" placeholder="Domain Name or IP 1" style="background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAwZJREFUWAntVktoE2EQntlNugkltYoKgtDYrMdasQpFPOjBS7WmisWDoOBFEBE8Ciql2IsXEREEwYPWi4U+RMV6aY+tGkWK0NS0RjQ+KsVIbdrS7P5+G7qb3WRTY00EsT8k/7x2vsm8skQrZyUD/3sG2EjAI1Wtmk+LdhK8n0jUCqKMvDzJ4Q9wPuBRpHPNY2MJHgju9iXp/VMhqK48gAW8Mk0q5KuXW6o9pwF+rIBZOcWVOmuVHiA0uqEw8zwJMQJdUjDXg17nZkfM9yGfd9XlCJF6nxCi2SZuRAAiYBNkSCZ+ICnyyXA0+tEQiNZWue/ZyzPI1GVBwgg6e3yeE4dGR6eygsJUf2jL+pn0zBfLQlDA6czQML9SPHS4KRq1fhV3dWnQXOmtUf1o0A...1mYHGwTmYG9wcyey8ATlqDJj4NmF/u6gWlQJUukZr/mceTsCwPbrD0+MXcDt2tYt8TfDfbXqKU2jTtMBDBuwJU12ydvNylECZqmjELjpOTwRu8tMcZP/09ueAU1eE4jQ22Jc8jBmP7ho+QmzUNQiwjPGIsLeyB4rAHTkt+ZIJJVVLUExJazd4/fWLXcKDARHCZaALJsKGeBpY5UKpip0871ikDAFWy27ufQtPOf632HZLBIpLeVzyJimjRIM4XMEnVyBu9VhUAwjxIFizAwblykYkqpp4w10tfHi8XcPXskqSGmX9sQH5xQP70IQV9GI49jtLoGWMjZOAOeOt0Leti/++nMpPa/4+jcz8BPw4Pa6no/fzAAAAABJRU5ErkJggg=="); background-repeat: no-repeat; background-attachment: scroll; background-size: 16px 18px; background-position: 98% 50%;" type="text"> 
     </div> 
    </div> 
</form> 

も、このようなフォーム要素を更新しようとしましたか？

Answer 1

回答は、もちろん非常に簡単だった：

$('#domainName').data('formValidation').destroy(); 

は、前ページのリロードなしで同じフォームを再利用に呼び出す必要があります。行うことを意図しているものすべてがちょうどHTML resetフォームのボタンのように、フィールド明らかなように

$('#domainName').data('formValidation').resetForm(); 

は、赤いニシンました。