jquery - 使用 Parsley 验证 Summernote 文本区域

Question

我已经使用 Parsley 验证器有一段时间了，我对它非常满意。不过，我遇到了一点麻烦，我真的无法弄清楚。

问题是这样的:我的文本区域(被 Summernote 替换)无法验证。让我先澄清一下，因为我知道问题是什么，但我无法找出答案。

在我的CMS中，用户可以通过Summernote编辑页面的文本。加载页面后，文本将出现在编辑器中。当查看我的源代码时，我看到这个:

<textarea name="content" class="summernote" required data-parsley-required>[The page information is shown, but I removed it because it it too long and unrelated to this topic.]</textarea>

当我编辑文本时，它会正常验证。但!当我删除文本并在编辑器为空时提交表单时，它也会验证。它只是处理表单，当页面重新加载时，它不会显示任何文本。从逻辑上讲，textarea 字段为空。

这里的问题是当页面加载并且文本区域有内容时，文本区域的验证将看到它不为空，从而提交我的表单。相反，我想验证实际文本区域，其中类名称是note-editable。

当文本编辑器为空时，它总是会说它是空的。即使我在编辑器中放入一些文本，它也不会提交，只是因为在页面加载时，文本区域没有内容。

所以我的问题是:当我使用 Summernote 时，如何防止用户使用 Parsley 提交空文本字段？因此，当用户从编辑器中删除文本时，表单将不会提交，并且用户会收到一条错误消息，指出文本字段为空。

非常感谢!

~米歇尔

Answer 1

我制作了这个对我有用的简单自定义函数。

<textarea id="mySummernote" name="mySummernote" data-parsley-summernote-required="" data-parsley-errors-container="#myErrors"></textarea>
<div id="myErrors"></div>
<script type="text/javascript">
    window.Parsley.addValidator('summernoteRequired', {
      validateString: function(value,_value,_el) {
        var val = $($(_el.$element[0]).val()).text().trim();
        if(val.length<1) return false; 
      },
      messages: {
        en: 'This is a required field.',
        it: "Questo valore è richiesto."
      }
    });
</script>

希望这对您有帮助。 :)