使用Jquery验证插件进行Summernote验证

mqxuamgl  于 2023-08-04  发布在  jQuery
关注(0)|答案(1)|浏览(138)

我有一个带有远程验证字段的表单。我的JavaScript如下:

$("#myform").validate({
        rules: {
        mainfield: {
          remote:{
              url: "checksnote.php",
              type: "POST",
              data: {
                mainfield: function() {
                return $("#mainfield").summernote('isEmpty');
              }
            }
          }
        }
        },
        messages:{
          mainfield: {
            remote: "This field is required",
            //minlength: "Minimum Length is 10"
          }
        },
        submitHandler: function(form) {
          alert("Successfully submittable");
          console.log("Successfully submittable");
          form.submit();
        }
      });

字符串
问题是我根本无法得到任何回应。两个远程请求都显示有效,但在浏览器中看不到 AJAX 请求。Mainfield是summernote textarea。所有其他验证都运行得非常好。你知道为什么remote连请求都不发吗?

**更新-**我也尝试添加方法没有工作。这就是为什么我尝试远程代替。任何一个都很好,如果对我有用。这是我的方法代码。浏览器未显示任何错误。

$.validator.addMethod('sumnoteempty', function(value,element){
        //return false;
        if(element.summernote('isEmpty')){
          console.log("In summernote validation!");
          return false;
        }
        else {
          return true;
        }
      }, "Must enter summernote content");


规则如下:

rules: {
mainfield: {
    sumnoteempty: true
}
},
message:{
   sumnoteempty: "Field can not be empty"
}


我不明白我在这里做错了什么。它甚至不显示消息在控制台。所有其他验证逻辑都运行良好。除了远程和添加方法。

fd3cxomn

fd3cxomn1#

不需要查询服务器来评估字段何时为空。创建使用Summernote isEmpty方法的自定义规则。

jQuery.validator.addMethod("requiredSummernote", function() {
    // true to pass validation
    // false to FAIL validation
    return !($("#mainfield").summernote('isEmpty'));
}, 'Summernote field is required');

$("#myform").validate({
    rules: {
        mainfield: { // name attribute
            requiredSummernote: true;  // apply the custom rule
        }
    },
    ....

字符串
https://jqueryvalidation.org/jQuery.validator.addMethod/
由于Summernote隐藏了原始的textarea元素并构建了自己的元素,因此您需要做一些其他事情来将这些元素整合在一起:

  • 编辑Validate插件的ignore选项,以强制验证隐藏的textarea元素。默认情况下忽略隐藏元素。
  • 使用errorPlacement选项更改验证消息在屏幕上的显示位置。它可能不合适,因为实际的数据输入元素被隐藏了。
  • 您可能需要构造以编程方式触发验证的处理程序。由于实际的数据元素是隐藏的,因此需要使用blurchange处理程序和强制测试的.valid()方法来触发验证。
  • 相反,如果错误消息不会消失,则构造一个在blur上触发的处理程序,它调用.valid(),然后隐藏包含错误消息的label元素。

相关问题