kissy/src/validation/demo/fun-fireerrmsg.html at master · ibtcss/kissy · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
<!doctype html>
<html>
<head>
	<meta charset="utf-8" />
	<title>Validation</title>
	<link rel="stylesheet" type="text/css"  href="../../../../kissy-dpl/base/build/css/dpl-pkg.css" />
	<script src="../../../build/kissy.js" charset="utf-8"></script>

	<link rel="stylesheet" type="text/css"  href="doc.css" /> <script src="doc.js" charset="utf-8"></script>
	<script type="text/javascript" src="../../../tools/utils/syntaxhighlighter_3.0.83/scripts/shCore.js"></script>
<script type="text/javascript" src="../../../tools/utils/syntaxhighlighter_3.0.83/scripts/shBrushJScript.js"></script>
<link type="text/css" rel="stylesheet" href="../../../tools/utils/syntaxhighlighter_3.0.83/styles/shCoreDefault.css"/>
<script type="text/javascript">SyntaxHighlighter.all();</script>


</head>
<body>


<div id="viewdemo" class="doc">


<div class="note">
Field.showMessage方法可以控制显示提示信息
</div>

<form method="post">
<ul class="form">

	<li>
		<label class="hd">姓名：</label>
		<input class="text" type="text" id="f1"  data-valid="{length:[3,6,true,'长度在{0}至{1}之间']}"/>
	</li>

	<li>
		<button type="submit">提交</button> <button type="button" id="fire-ok">对了</button> <button type="button" id="fire-err">错了</button>
	</li>

</ul>
</form>

<script>


	KISSY.use("validation",function(S,Validation){

			var form = S.query("form")[0],

				check = new Validation(form,{
					style: "under"
				}),

				field = check.get("f1");


			KISSY.Event.on("#fire-ok","click",function(){
				field.showMessage(true);
			});


			KISSY.Event.on("#fire-err","click",function(){
				field.showMessage(false,"可以自定义一个错误信息");
			});

			KISSY.Event.on(form,"submit",function(){
				check.isValid();
				return false;
			});

	});

</script>


</div>


</body>
</html>