`
yuanjinxiu
  • 浏览: 658199 次
文章分类
社区版块
存档分类
最新评论

dijit.form.ValidationTextbox

 
阅读更多

功能强大的文本框:dijit.form.ValidationTextbox
这个文本输入框的功能比较强大,关键是它能够提供一些常用的验证和大小写转换。下面介绍一个例子和一些常用的属性:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>validationTextbox</title>
<style type="text/css">
@import "../js/dojo/resources/dojo.css";
@import "../js/dijit/themes/tundra/tundra.css";
.dijitInputFieldFocused{
border:solid 2px #FFDF00;
}
</style>
<script type="text/javascript"
djConfig="parseOnLoad: true, isDebug: true"
src="../js/dojo/dojo.js"></script>
<script>
dojo.require("dijit.form.ValidationTextbox");
dojo.require("dijit.form.NumberTextbox");
</script>
</head>
<body class="tundra">
<form name="form1">
<input type="text" id="vt" dojoType="dijit.form.ValidationTextbox"
promptMessage="请输入信息"
invalidMessage="输入的信息有误"
required="true"
trim="true"
propercase="true"
><br />
一些属性:<br />
required="true" //必须填写<br />
trim="true" //将前后的空格自动删除<br />
propercase="true" //单词首字母大写<br />
uppercase="true" //大写字母形式<br />
lowercase="true" //小写字母形式<br />
<hr />
验证文本组件可以支持正则表达式验证,比如:<br />
不包含空格验证:<input id="vt1" type="text" name="phone"value="someTestString"
dojoType="dijit.form.ValidationTextbox"
regExp="[/w]+"
required="true"
trim="true"
invalidMessage="输入中不允许包含空格"><br />
email地址验证:<input id="vt2" type="text" name="phone"value="/amushen2005@hotmail.com"
dojoType="dijit.form.ValidationTextbox"
regExp="(/w+@/w+/./w+)(/.{0,1}/w*)(/.{0,1}/w*)"
required="true"
trim="true"
invalidMessage="输入合法的email地址"><br />
只允许输入数字:
<input id="vt1" type="text" name="phone"value="/123.34"
dojoType="dijit.form.NumberTextbox"
required="true"
trim="true"
invalidMessage="只允许输入数字"><br />
</form>
</body>
</html>
ValidationTextbox的一些常用方法:
setValue();//不要使用.value或者.innerHTML来设置值,你可能设置不成功或者失去校验
getValue();
validate(); 手工校验
isEmpty(); 是否为空
isValid(); 是否符合校验规则
关于校验的正则表达式法比较灵活,功能也非常强大,可以到微软或者sun的官方网站查看一些权威的资料。或者直接上网上搜索一些常用的正则表达式。
下面给出一些常用正则表达式:
1、 非负整数:”^d+$”
2、 正整数:”^[0-9]*[1-9][0-9]*$”
3、 非正整数:”^((-d+)|(0+))$”
4、 负整数:”^-[0-9]*[1-9][0-9]*$”
5、 整数:”^-?d+$”
6、 非负浮点数:”^d+(.d+)?$”
7、 正浮点数:”^((0-9)+.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*.[0-9]+)|([0-9]*[1-9][0-9]*))$”
8、 非正浮点数:”^((-d+.d+)?)|(0+(.0+)?))$”
9、 负浮点数:”^(-((正浮点数正则式)))$”
10、英文字符串:”^[A-Za-z]+$”
11、英文大写串:”^[A-Z]+$”
12、英文小写串:”^[a-z]+$”
13、英文字符数字串:”^[A-Za-z0-9]+$”
14、英数字加下划线串:”^w+$”
15、E-mail地址:”^[w-]+(.[w-]+)*@[w-]+(.[w-]+)+$”
16、URL:”^[a-zA-Z]+://(w+(-w+)*)(.(w+(-w+)*))*(?s*)?$”
17、匹配中文字符的正则表达式: [/u4e00-/u9fa5]
18、匹配双字节字符(包括汉字在内):[^/x00-/xff]
19、匹配HTML标记的正则表达式:/<(.*)>.*<///1>|<(.*) //>/
20、匹配国内电话号码:/d{3}-/d{8}|/d{4}-/d{7}
21、匹配中国邮政编码:[1-9]/d{5}(?!/d)
22、匹配身份证:/d{15}|/d{18}
分享到:
评论

相关推荐

    Dojo_digitDemo1

    如何使用dojo的digit组件, dojo.require("dijit.layout.ContentPane"); dojo.require("dijit.layout.TabContainer");... dojo.require("dijit.form.ValidationTextBox"); dojo.require("dijit.form.DateTextBox");

    dojo 树形列表 dijit.tree

    5个例子,为: 基础树 后台读取 分级 拖曳 数据库读取并存储 有些例子是基于 php 的

    Xpage学习笔记

    new dijit.form.NumberSpinner({name:"#{id:numSales}", value:myvalue, smallDelta:1, constraints:{min:0,places:0}}, XSP.getElementById("#{id:numSales}")); 2.5.3 在xpage中使用ProgressBar(dijit....

    dojo精品中文教程(包一)

    Dojo学习笔记--dijit.Dialog Dojo学习笔记--dijit.Menu Dojo学习笔记--dijit.TitlePane Dojo学习笔记--dijit.Tooltip Dojo学习笔记--dijit.Tree Dojo学习笔记--dojo.graphics.color & dojo.uri.Uri Dojo学习...

    dojo精品中文教程(包二)

    Dojo学习笔记--dijit.Dialog Dojo学习笔记--dijit.Menu Dojo学习笔记--dijit.TitlePane Dojo学习笔记--dijit.Tooltip Dojo学习笔记--dijit.Tree Dojo学习笔记--dojo.graphics.color & dojo.uri.Uri Dojo学习...

    dojo精品中文教程(包三)

    Dojo学习笔记--dijit.Dialog Dojo学习笔记--dijit.Menu Dojo学习笔记--dijit.TitlePane Dojo学习笔记--dijit.Tooltip Dojo学习笔记--dijit.Tree Dojo学习笔记--dojo.graphics.color & dojo.uri.Uri Dojo学习...

    dojo精品中文教程(全)

    Dojo学习笔记--dijit.Dialog Dojo学习笔记--dijit.Menu Dojo学习笔记--dijit.TitlePane Dojo学习笔记--dijit.Tooltip Dojo学习笔记--dijit.Tree Dojo学习笔记--dojo.graphics.color & dojo.uri.Uri Dojo学习...

    dojo checkbox tree

    利用dojo的ajax实现树结构,带有checkbox功能

    自己开发Dojo的建议框架

    1.由于Dojo的每一个版本变化都比较大。 2.Dojo更新都比较快,基本上是1–2个月一个新的版本。 3.Dojo有很多不完善的地方,在实际应用中如果... 例如: dijit.form.Button 我们想在这个基础上定制一个只显示Icon的Butt

    Mizuhiki:在标记中绑定 mustache 模板和 javascript 对象

    Mizuhiki - 与 Clazz 的数据绑定 Mizuhiki 是一个模块: 需要一个模板类 读取其模板 通过 mustache 解析它(有一... input type =" text " value =" {{Text}} " data-dojo-type =" dijit.form.TextBox " data-dojo-pr

    在google地图上右击时显示菜单

    var conMenu=dijit.byId("GOOGLEMAP_menu_"+fieldId); if(menCon!=null && conMenu!=undefined){ conMenu.destroy(); //摧毁菜单 map.getPane(G_MAP_FLOAT_PANE).removeChild(menCon); } //在...

    Dojo Toolkit 1.2.0: Dojo + Dijit + DojoX

    Extract files from the download locally or on a web server. Include ...Browse to dojo/tests/runTests.html or dijit/themes/themeTester.html to see Dojo in action

    dijit-icons:可用于任何 Dojo 项目的可用 Dijit 图标集合

    button data-dojo-type="dijit/form/Button" data-dojo-props="iconClass: 'NAME_OF_CLASS'" type="button"&gt;&lt;/button&gt; 编辑器图标需要有一个额外的类dijitEditorIcon : &lt;button data-dojo-type=...

    Mastering Dojo-JavaScript and Ajax Tools for Great Web Experiences

    2.3 Adding Dojo and Dijit to a Page . . . . 22 2.4 Laying Out the Form 26 2.5 Improved Form Controls . . . 31 2.6 Wrapping It Up . . . 34 3 Connecting to Outside Services 37 3.1 Dojo Remote Scripting ...

    dijit-claro-stylus:Dijit 的 Claro 主题从 Less 到 Stylus 的直接转换

    form layout 笔记 已通过以下过程检查此转换结果的准确性: 比较 LESS 和 Stylus 的(接近)匹配值的 CSS 输出 将先前和当前 Dojo 版本的 LESS 之间的差异与此存储库中先前和当前版本之间的相应差异进行比较 使用...

    dijit-pagination-js:用于分页结果的 Dojo Dijit

    dijit-分页-js 0.2 用于分页的 Dijit 描述 这个 Dojo 小部件在您选择的 DOM 元素中呈现一个分页列表,以便您可以轻松地对结果进行分页。 入门 将 dojo 配置添加到您的 HTML 头中 &lt; script &gt; // host path ...

    Dojo Toolkit - ProgressBar test

    Dijit ProgressBar Tests. Test 1. Progress Value Max Progress Value. Test 2. Write here: Small, without text and background image: Show decimal place: Test 3 ...

    Dojo 小部件开发演示

    dojo dijit 小部件开发,将两个 Button 和一个 FilteringSelect 进行组合构成一个新的部件,便于开发部署,减少代码量.

    Dojo包下载 包含dijit dojo dojox util四个文件目录

    Dojo开发包: 包含以下目录dijit dojo dojox util

    iframe父页面获取子页面参数的方法

    input type=”text” id=”date” data-dojo-type=”dijit/form/DateTextBox” value=”2013-11-12″/&gt; 3、取子页面中DateTextBox中值 代码如下: var statisDate = window.frames[“parentPage”].document....

Global site tag (gtag.js) - Google Analytics