Jquery验证在错误的位置显示错误消息

时间:2018-02-07 06:10:36

标签: jquery jquery-validate

我使用Jquery验证来形成验证。表单包含动态字段。我需要在相应的字段中显示错误消息。例如,我有两个字段是test1和test2。 test2字段有错误消息,因此消息应该仅显示它,但该消息显示在test1字段中。错误消息显示在错误的位置。

在这里,我的表格

<form class="form-horizontal" id="submit-requirements-form" action="/organizations" accept-charset="UTF-8" method="post" novalidate="novalidate">  
  <input name="submit_requirements[sites][sample_page_url][]" id="submit_requirements_sites_sample_page_url_1" placeholder="http://www.ebay.com/sch/DSLR-Cameras/31388/bn_732/i.html" class="sample_page_url url_fields error" type="text">
   /-- Here you can see the error message. This is wrong and it should come to second input --/
  <label id="submit_requirements_sites_sample_page_url_1-error" class="error" for="submit_requirements_sites_sample_page_url_1">Crawling of this site is not feasible.</label>

  <input name="submit_requirements[sites][sample_page_url][]" id="submit_requirements_sites_sample_page_url_2" placeholder="http://www.ebay.com/sch/DSLR-Cameras/31388/bn_732/i.html" class="sample_page_url url_fields" type="text">
</form>

我的Jquery代码

$("#submit-requirements-form").validate();

$('input.url_fields').each(function() {
   $(this).rules('add', {
     url2: true,
     remote: {
       type: 'POST',
       url: '/sites/check_feasibility',
       dataType: 'json',
       dataFilter: function(resp) {
         console.log(resp);
         resp = JSON.parse(resp);
         return resp.status === 'feasible';
      }
    },
   messages: {
     url2: 'Please enter the URL of a page from where you would like to extract data.',
     remote: 'Crawling of this site is not feasible.'
   }
 });
});

1 个答案:

答案 0 :(得分:0)

在jquery验证中使用错误放置

errorPlacement: function(error, element) {
   if (element.attr("name") == "element_name") {
      error.insertAfter('#element_div_id');
   }
   else {
      error.insertAfter(element);
   }
}

希望这有助于你