2

我已经成功地验证了选择的插件选择表单。但是，我在更改错误位置时遇到问题。它总是出现在元素的顶部。

这是我的代码：

<script>
$('#form-scriptolution-soft-post-image').on('submit', function() {$('.chzn-done').valid();
});
</script>

<div class="field">
<label>
<h4>{$lang260}<span> *</span></h4>                        
</label>
<select name="CID" id="CID" required style="width:389px; height: 30px;" data-    placeholder="Choose..." >
<option value=""></option>
{section name=i loop=$c}                  
<option value="{$c[i].CID}">{$c[i].cname}</option>
{/section}
</select>                        
<p class="info">some text</p>
</div>

我希望错误出现在

“一些文本”位置的元素

我一直在尝试使用以下内容，它适用于我的所有其他表单元素：

errorElement: 'p',
errorClass: 'error',
errorContainer: ".field p"

任何想法将不胜感激

我能够解决这个问题。这是我的代码现在的样子：

<script type="text/javascript"> 
$(document).ready(function(){

$('#form-scriptolution-soft-post-image').validate(
{
ignore: "",
rules: {
image: {
required: true
},
CID: {
required: true
},
title: {
required: true
},
tags: {
required: true
},
},
errorPlacement: function (error, element) {
$('.field p').html(error);

},
});
});
jQuery.extend(jQuery.validator.messages, {
required: "This is a required field.",
});
// end document.ready
</script> 

<div class="field">
<label>
<h4>{$lang260}<span> *</span></h4>                        
</label>
<select name="CID" id="CID" required style="width:389px; height: 30px;" data-       placeholder="Choose..." >
<option value=""></option>
{section name=i loop=$c}                  
<option value="{$c[i].CID}">{$c[i].cname}</option>
{/section}
</select>                        
<p class="info">some text</p>
</div>

我所做的是添加ignore: "",验证代码，以便验证插件不会忽略隐藏字段。Chosen 插件实际上隐藏了默认的选择字段。p通过添加以下errorPlacement选项，我能够在元素 I 的位置输出错误：

errorPlacement: function (error, element) {
$('.field p').html(error);

现在一切都按预期工作。谢谢！

4

2 回答 2

2

您可以使用其功能更改错误放置的位置。这是一个例子：

    $("#form").validate({
    rules: {
         operations:
        {
            required: true
        }
    },
    errorPlacement: function(error, element) {
        if (element.attr("name") == "operations") {
            error.insertAfter("#operations_chosen");
        }else{
            error.insertAfter(element);
        }
    }
});
于 2015-09-30T07:15:08.267 回答
0

只需测试结果valid()并使用 JQuery 选择器自己更改文本。

<script>
  $('#form-scriptolution-soft-post-image').on('submit', function() {
    if(!$('.chzn-done').valid()){
      $('.field p').html('You must select a choice!');
      return false;
    } else {
      return true;
    }
  });
</script>
于 2012-11-13T11:40:53.397 回答