Question

我在同一页面上有两个表单。我想用一些YUI模块来验证这两种形式。我可以使用模块aui-form-validator按照我的要求验证表单，如下所示。

YUI().use('aui-form-validator', function(Y) {
        new Y.FormValidator(
          {
                boundingBox: '#form1',
                rules:{
                    answer:{
                        required : true,
                        minLength: 5,
                        maxLength: 600
                    }
                },
                fieldStrings:
                {
                    answer:{
                        required: "Please add the answer",
                        minLength: "Please enter atleast 5 characters",
                        maxLength: "Please enter no more than 600 characters"
                    }
                }
         });

});

上面的代码工作正常，但是当我尝试为vaidating form2添加相同的代码集时，它无法正常工作。只有先写的是工作。

请帮忙。

Answer 1

如果您还提供不起作用的示例，而不仅仅是工作示例，那将更有用。

另外我建议添加AUI标签，因为你没有在这里使用纯YUI。

您使用的是哪个版本？

无论如何，我刚试过以下代码片段，它对我有用：

<script src="http://cdn.alloyui.com/3.0.1/aui/aui-min.js"></script>
<link href="http://cdn.alloyui.com/3.0.1/aui-css/css/bootstrap.min.css" rel="stylesheet"></link>

<form id="form1">
<input name="answer" type="text" value=""> 
<input type="submit" value="SUBMIT">
</form>

<form id="form2">
<input name="answer2" type="text" value=""> 
<input type="submit" value="SUBMIT">
</form>

<script>
YUI().use('aui-form-validator', function(Y) {
        new Y.FormValidator(
          {
                boundingBox: '#form1',
                rules:{
                    answer:{
                        required : true,
                        minLength: 5,
                        maxLength: 600
                    }
                },
                fieldStrings:
                {
                    answer:{
                        required: "Please add the answer",
                        minLength: "Please enter atleast 5 characters",
                        maxLength: "Please enter no more than 600 characters"
                    }
                }
         });


           new Y.FormValidator(
          {
                boundingBox: '#form2',
                rules:{
                    answer2:{
                        required : true,
                        minLength: 5,
                        maxLength: 600
                    }
                },
                fieldStrings:
                {
                    answer2:{
                        required: "Please add the answer2",
                        minLength: "Please enter atleast 5 answer2",
                        maxLength: "Please enter no more than 600 answer2"
                    }
                }
         });

});
</script>

Wdyt？

多个YUI在同一页面上形成验证器

1 个答案: