PageRenderTime 33ms CodeModel.GetById 12ms app.highlight 15ms RepoModel.GetById 2ms app.codeStats 0ms

/source/Plug-in/ext/colorpicker/test.html

http://prosporous.googlecode.com/
HTML | 93 lines | 89 code | 4 blank | 0 comment | 0 complexity | 707764bae777069bc8047ddf743c2a52 MD5 | raw file
 1<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
 2<html>
 3	<head>
 4		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
 5		<title>ColorPickerField Test</title>
 6		<link rel='stylesheet' type='text/css' href='../ext/resources/css/ext-all.css' />
 7		<link rel="stylesheet" type="text/css" href="colorpicker.css" />
 8
 9		<script type="text/javascript" src="../ext/adapter/ext/ext-base.js"></script>
10		<script type="text/javascript" src="../ext/ext-all-debug.js"></script>
11
12		<script type="text/javascript" src="../fieldpanel/fieldpanel.js"></script>
13		<script type="text/javascript" src="colorpicker.js"></script>
14		<script type="text/javascript" src="colorpickerfield.js"></script>
15				
16		<script type="text/javascript">
17			Ext.QuickTips.init();
18			Ext.form.Field.prototype.msgTarget = 'side';
19			
20			Ext.onReady(function(){
21				var valid=true;
22				var enable=true;
23				var win = new Ext.Window({
24					renderTo: document.body,
25					title: "ColorPicker Test",
26					width: 600,
27					height: 400,
28					items: [{
29						xtype: 'form',
30						border: false,
31						bodyStyle: 'background-color:#DFE8F6; padding-top:10px',
32						labelAlign: 'right',
33						labelWidth: 50,
34						items: [{
35							xtype: 'textfield',
36							fieldLabel: 'Name',
37							name: 'name'
38						}, {
39							xtype: 'colorpickerfield',
40							fieldLabel: 'Color',
41							name: 'color',
42							value: '123456'
43						}]
44					}],
45					buttons:[{
46						text:"Invalid",
47						handler:function(){
48							var form=win.getComponent(0).getForm();
49							var n=form.findField('name');
50							var c=form.findField('color');
51							if (valid) {
52								n.markInvalid();
53								c.markInvalid();
54								valid = false;
55							} else {
56								n.clearInvalid();
57								c.clearInvalid();
58								valid = true;
59							}
60						}
61					}, {
62						text:"Disable",
63						handler: function(){
64							var form=win.getComponent(0).getForm();
65							var n=form.findField('name');
66							var c=form.findField('color');
67							if (enable) {
68								n.disable();
69								c.disable();
70								enable = false;
71							} else {
72								n.enable();
73								c.enable();
74								enable = true;
75							}
76						}
77					}, {
78						text:"Values",
79						handler: function(){
80							var form=win.getComponent(0).getForm();
81							var n=form.findField('name');
82							var c=form.findField('color');
83							Ext.Msg.alert("Value", "Name: "+n.getValue()+"<br />Color: "+c.getValue());
84						}
85					}]
86				});
87				win.show();
88			});
89		</script>
90	</head>
91	<body>
92	</body>
93</html>