文本区域的Dojo验证

我试图第一次使用dojo,所以这可能是显而易见的.

我有一个非常简单的形式,其中有一个textarea需要填写.

<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.10.3/dojo/dojo.js"></script>
<form id='form1' action="" method="" dojoType="dijit.form.Form">
  <label for="dob">desc:</label>
  <textarea class='multilinecontrol' dojoType="dijit.form.Textarea" selected='true' required='true'></textarea>
  <button type='submit' id="next" name="next" dojoType="dijit.form.Button">
    Next</button>
</form>

我添加了’required’属性,因此我可以确保表单在用户可以继续之前有效.

然而,当表单显示时,textarea周围有一个红色的焦点环,其他小部件都不像这样,它真的很烦人.

知道怎么摆脱它吗？

我可以通过将某种默认文本放入“把东西放在这里”来破解它,但是我必须做额外的验证工作 – 我现在无法解决该怎么做.

它不是复制整个现有的类,而是使用mixin就足够了：

define(["dojo/_base/declare","dojo/_base/lang","dijit/form/SimpleTextarea","dijit/form/ValidationTextBox"],function(declare,lang,SimpleTextarea,ValidationTextBox) {

  return declare('dijit.form.ValidationTextArea',[SimpleTextarea,ValidationTextBox],{
    constructor: function(params){
      this.constraints = {};
      this.baseClass += ' dijitValidationTextArea';
    },templateString: "<textarea ${!nameAttrSetting} data-dojo-attach-       point='focusNode,containerNode,textBox' autocomplete='off'></textarea>",validator: function(value,constraints) {
      return (new RegExp("^(?:" + this._computeRegexp(constraints) + ")"+(this.required?"":"?")+"$",["m"])).test(value) &&
        (!this.required || !this._isEmpty(value)) &&
        (this._isEmpty(value) || this.parse(value,constraints) !== undefined); // Boolean
    }
    })
  })

不幸的是,我无法使用红色感叹号和验证输入获得完全相同的行为 – 因为Textarea调整了大小,所以我已经完成了CSS技巧：

.dijitValidationTextAreaError,.dijitValidationTextAreaError.dijitTextBoxHover {
 background-image: url("error.png");
 background-position: right;
 background-repeat: no-repeat;
}

需要将error.png从claro主题复制到css位置.它显示在文本区域内,而不是在文本区域之外,但它是唯一的,非常小的区别.

文本区域的Dojo验证

相关文章