Dojo ValidatedTextBox不起作用

时间:2014-05-21 06:50:07

标签: dojo

为了解决这个问题,我已经搜索过高低,但我找不到任何东西。我正在玩dojo ValidatationTextBox dijit。我尝试过声明式和编程式方法,并且每次都作为只读输入字段出现。提供的代码显示了我使用声明方法的尝试。我使用类似于"新文本框"的编程路线获得了完全相同的结果。以下电话。在这两种方法中,ValidatationTextBox的html都是使用两个子div生成的。一个使用class = dijitReset dijitValidationContainer,另一个使用class = dijitReset dijitInputField dijitInputContainer。它是后一个类,它包含所有html输入和dijit属性,前者将表单定义为readonly,并为其提供值' x'。我究竟做错了什么?任何帮助或解释为什么这不起作用将不胜感激。谢谢             

    <script>
        require(["dojo/parser", "dijit/form/TextBox", "dijit/form/ValidationTextBox","dojo/domReady!","dojox/validate","dojox/validate/web"],
        function(parser, textbox, ValidationTextBox,validate){

            parser.parse();

            new textbox({
                    id: "fName",
                    maxlength: 25,
                    name: "fName",
                    trim: "true",
                    propercase: "true"
            }, "fName");

            new textbox({
                    id: "lName",
                    maxlength: 25,
                    name: "lName",
                    trim: "true",
                    propercase: "true"
            }, "lName");


        });
    </script>

</head>
<body class="tundra">
        <h3>Sign-up for our great offers:</h3>
        <form id="registration_form">
            <div class="grouping">
                <label for="fName">First Name:</label>
                <input id="fName" /><br />
                <label for="lName">Last Name:</label>
                <input id="lName" /><br />
                <label for="email">Your Email:</label>
                <input type="text" name="email" required="true" readonly="false"
                data-dojo-type="dijit/form/ValidationTextBox"
                data-dojo-props="regExp:'[a-z0-9._%+-]+@[a-z0-9-]+\.[a-z]{2,4}', invalidMessage:'Please enter a valid e-mail address'" /><br />
                <button id="btn">Sign Up!</button>
            </div>
        </form>
</body> 

1 个答案:

答案 0 :(得分:0)

我认为问题可能出在您的regExp上,但是您可以编写一个keyup函数并在用户输入时调用它将使用Dojo内置的电子邮件验证来验证电子邮件地址。同样对于您的fname和lname字段,请尝试设置required = "true"。您可以执行此操作以实现即时验证,因为如果您不需要字段,则需要在发布时在表单上调用验证。您可以参考此Form Validation Fiddle

HTML

 <input type= "text" name ="email" data-dojo-type="dijit/form/ValidationTextBox" missingMessage="Email Address Required" invalidMessage="Invalid Email Address" onkeyup="validateMe(this.value);" required="true" />

<强> JS

function validateMe(email){    
  var isValid = false;    
  isValid = dojox.validate.isEmailAddress(email);
  return isValid;    
}