/**
2
3 * Providing some simple static methods for tool classes for page element objects
4
5 */
6
7 var Field = {
8
9 /**
10
11 * Clear the value of the parameter reference object
12
13 */
14
15 clear: function() {
16
17 for (var i = 0; i < ; i++)
18
19 $(arguments[i]).value = '';
20
21 },
22
23
24 /**
25
26 * Make the parameter reference object get focus
27
28 */
29
30 focus: function(element) {
31
32 $(element).focus();
33
34 },
35
36
37 /**
38
39 * �
40
41 */
42
43 present: function() {
44
45 for (var i = 0; i < ; i++)
46
47 if ($(arguments[i]).value == '') return false;
48
49 return true;
50
51 },
52
53
54 /**
55
56 * Make the selected parameter reference object
57
58 */
59
60 select: function(element) {
61
62 $(element).select();
63
64 },
65
66
67 /**
68
69 * Make the parameter reference object in an editable state
70
71 */
72
73 activate: function(element) {
74
75 $(element).focus();
76
77 $(element).select();
78
79 }
80
81 }
82
83
84 /*-----------------------------------------------------------------*/
85
86
87 /**
88
89 * Form Tools
90
91 */
92
93 var Form = {
94
95 /**
96
97 * Combining the serialized values of form elements into the form QueryString
98
99 */
100
101 serialize: function(form) {
102
103 var elements = ($(form));
104
105 var queryComponents = new Array();
106
107
108 for (var i = 0; i < ; i++) {
109
110 var queryComponent = (elements[i]);
111
112 if (queryComponent)
113
114 (queryComponent);
115
116 }
117
118
119 return ('&');
120
121 },
122
123
124 /**
125
126 * Get all element objects of the form
127
128 */
129
130 getElements: function(form) {
131
132 form = $(form);
133
134 var elements = new Array();
135
136
137 for (tagName in ) {
138
139 var tagElements = (tagName);
140
141 for (var j = 0; j < ; j++)
142
143 (tagElements[j]);
144
145 }
146
147 return elements;
148
149 },
150
151
152 /**
153
154 * Put elements of the specified form in an unavailable state
155
156 */
157
158 disable: function(form) {
159
160 var elements = (form);
161
162 for (var i = 0; i < ; i++) {
163
164 var element = elements[i];
165
166 ();
167
168 = 'true';
169
170 }
171
172 },
173
174
175 /**
176
177 * Make the first element of the form that is not of hidden type and is in available state focus
178
179 */
180
181 focusFirstElement: function(form) {
182
183 form = $(form);
184
185 var elements = (form);
186
187 for (var i = 0; i < ; i++) {
188
189 var element = elements[i];
190
191 if ( != 'hidden' && !) {
192
193 (element);
194
195 break;
196
197 }
198
199 }
200
201 },
202
203
204 /*
205
206 * Reset the form
207
208 */
209
210 reset: function(form) {
211
212 $(form).reset();
213
214 }
215
216 }
217
218
219 /**
220
221 * Form Element Tool Class
222
223 */
224
225 = {
226
227 /**
228
229 * Return the value of the form element first serialize and then URL encoded.
230
231 */
232
233 serialize: function(element) {
234
235 element = $(element);
236
237 var method = ();
238
239 var parameter = [method](element);
240
241
242 if (parameter)
243
244 return encodeURIComponent(parameter[0]) + '=' +
245
246 encodeURIComponent(parameter[1]);
247
248 },
249
250
251 /**
252
253 * Return the serialized value of the form element
254
255 */
256
257 getValue: function(element) {
258
259 element = $(element);
260
261 var method = ();
262
263 var parameter = [method](element);
264
265
266 if (parameter)
267
268 return parameter[1];
269
270 }
271
272 }
273
274
275 /**
276
277 * The so-called serialization of prototype is actually combining the name and value of the form into an array
278
279 */
280
281 = {
282
283 input: function(element) {
284
285 switch (()) {
286
287 case 'hidden':
288
289 case 'password':
290
291 case 'text':
292
293 return (element);
294
295 case 'checkbox':
296
297 case 'radio':
298
299 return (element);
300
301 }
302
303 return false;
304
305 },
306
307
308 inputSelector: function(element) {
309
310 if ()
311
312 return [, ];
313
314 },
315
316
317 textarea: function(element) {
318
319 return [, ];
320
321 },
322
323
324 /**
325
326 * It seems that it does not support multiple selection boxes (select-multiple)
327
328 */
329
330 select: function(element) {
331
332 var index = ;
333
334 var value = [index].value || [index].text;
335
336 return [, (index >= 0) ? value : ''];
337
338 }
339
340 }
341
342
343 /*--------------------------------------------------------------------------*/
344
345
346 /**
347
348 * Maybe it will be used frequently, so I made a quick quote
349
350 */
351
352 var $F = ;
353
354
355 /*--------------------------------------------------------------------------*/
356
357
358 /**
359
360 * It's useless () to create,
361
362 * The intention should be the same
363
364 * As the name suggests,
365
366 * It is to use the Observer design pattern to track specified form elements,
367
368 * When the value of the form element changes, execute the callback function
369
370 *
371
372 * I think Observer is similar to registering onchange events,
373
374 * The difference is that onchange event loses focus on the element
375
It is only inspired when 376 * .
377
378 * The same is similar to the onpropertychange event,
379
380 * However, it only focuses on the changes in the value of the form element and provides timeout control.
381
382 *
383
384 * In addition, the benefits of Observer are probably that it is more object-oriented, and the callback function can be dynamically replaced.
385
386 * This is more flexible than registering events.
387
388 * Observer should be competent for dynamic data verification, or the connection of multiple associated drop-down option lists, etc.
389
390 *
391
392 */
393
394 = function() {}
395
396
397 /**
398
399 * This design is the same as PeriodicalExecuter. The bind method is the core of the implementation
400
401 */
402
403 = {
404
405 initialize: function(element, frequency, callback) {
406
407 = frequency;
408
409 = $(element);
410
411 = callback;
412
413
414 = ();
415
416 ();
417
418 },
419
420
421 registerCallback: function() {
422
423 setTimeout((this), * 1000);
424
425 },
426
427
428 onTimerEvent: function() {
429
430 var value = ();
431
432 if ( != value) {
433
434 (, value);
435
436 = value;
437
438 }
439
440
441 ();
442
443 }
444
445 }
446
447
448 /**
449
450 * It's actually the same
451
452 * Note It is not used to track the entire form, I think it is probably just
453
454 * To reduce writing (this is a design principle of Ruby)
455
456 */
457
458 = ();
459
460 = (new ()).extend({
461
462 getValue: function() {
463
464 return ();
465
466 }
467
468 });
469
470
471 = ();
472
473 = (new ()).extend({
474
475 getValue: function() {
476
477 return ();
478
479 }
480
481 });