Commit 92aaf3a89a032bcdefc19db1c159d6db8548b4cd
1 parent
4c865069
Exists in
master
Adicionados novos métodos no objeto JavaScript {{{ied_forms}}}:
* {{{bind}}}: possibilita registrar listeners para os eventos do DOM; * {{{getElementsByName}}}: extract method dos métodos bind e checkAll, possibilita buscar por elementos DOM a partir do nome ou por um padrão regex do nome.
Showing
1 changed file
with
75 additions
and
3 deletions
Show diff stats
ieducar/intranet/scripts/ied/forms.js
@@ -40,6 +40,7 @@ var ied_forms = new function() { | @@ -40,6 +40,7 @@ var ied_forms = new function() { | ||
40 | * @param document docObj | 40 | * @param document docObj |
41 | * @param string formId | 41 | * @param string formId |
42 | * @param string fieldsName | 42 | * @param string fieldsName |
43 | + * @see ied_forms.getElementsByName | ||
43 | */ | 44 | */ |
44 | this.checkAll = function(docObj, formId, fieldsName) { | 45 | this.checkAll = function(docObj, formId, fieldsName) { |
45 | if (checker === 0) { | 46 | if (checker === 0) { |
@@ -48,14 +49,85 @@ var ied_forms = new function() { | @@ -48,14 +49,85 @@ var ied_forms = new function() { | ||
48 | checker = 0; | 49 | checker = 0; |
49 | } | 50 | } |
50 | 51 | ||
52 | + var elements = ied_forms.getElementsByName(docObj, formId, fieldsName); | ||
53 | + for (e in elements) { | ||
54 | + elements[e].checked = checker == 1 ? true : false; | ||
55 | + } | ||
56 | + }; | ||
57 | + | ||
58 | + /** | ||
59 | + * Faz um bind de eventos para um elemento HTML. Baseia-se nos métodos de | ||
60 | + * eventos W3C e clássico. O método do Internet Explorer (attachEvent) é | ||
61 | + * ignorado pois passa os argumentos das funções anônimas com cópia e sim | ||
62 | + * por referência, fazendo com que as variáveis this referenciem o objeto | ||
63 | + * window global. | ||
64 | + * | ||
65 | + * Para registrar diversas funções como listener ao evento, crie uma função | ||
66 | + * anônima: | ||
67 | + * | ||
68 | + * <code> | ||
69 | + * window.load = function() { | ||
70 | + * var events = function() { | ||
71 | + * function1(params); | ||
72 | + * function2(params); | ||
73 | + * functionN(params); | ||
74 | + * } | ||
75 | + * new ied_forms.bind(document, 'formId', 'myRadios', 'click', events); | ||
76 | + * } | ||
77 | + * </code> | ||
78 | + * | ||
79 | + * @param document docObj | ||
80 | + * @param string formId | ||
81 | + * @param string fieldsName | ||
82 | + * @param string eventType O tipo de evento para registrar o evento | ||
83 | + * (listener), sem a parte 'on' do nome. Exemplos: click, focus, mouseout. | ||
84 | + * @param string eventFunction Uma função listener para o evento. Para | ||
85 | + * registrar várias funções, crie uma função anônima. | ||
86 | + * @see ied_forms.getElementsByName | ||
87 | + * @link http://www.quirksmode.org/js/events_advanced.html Advanced event registration models | ||
88 | + * @link http://www.quirksmode.org/js/events_tradmod.html Traditional event registration model | ||
89 | + * @link http://javascript.about.com/library/bldom21.htm Cross Browser Event Processing | ||
90 | + * @link http://www.w3schools.com/jsref/dom_obj_event.asp Event Handlers | ||
91 | + */ | ||
92 | + this.bind = function(docObj, formId, fieldsName, eventType, eventFunction) { | ||
93 | + var elements = ied_forms.getElementsByName(docObj, formId, fieldsName); | ||
94 | + | ||
95 | + for (e in elements) { | ||
96 | + if (elements[e].addEventListener) { | ||
97 | + elements[e].addEventListener(eventType, eventFunction, false); | ||
98 | + } | ||
99 | + else { | ||
100 | + // Usa o modo tradicional de registro de eventos ao invés do método | ||
101 | + // nativo do Internet Explorer (attachEvent). | ||
102 | + elements[e]['on' + eventType] = eventFunction; | ||
103 | + } | ||
104 | + } | ||
105 | + }; | ||
106 | + | ||
107 | + /** | ||
108 | + * Retorna objetos de um formulário ao qual o nome (atributo name) seja | ||
109 | + * equivalente ao argumento fieldsName. Esse argumento aceita expressões | ||
110 | + * regulares, o que o torna mais flexível para atribuir eventos ou atributos | ||
111 | + * a múltiplos elementos da árvore DOM. | ||
112 | + * | ||
113 | + * @param document docObj Um objeto document, geralmente o objeto global document. | ||
114 | + * @param string formId O atributo "id" do formulário. | ||
115 | + * @param string fieldsName O nome do elemento de formulário ou uma string Regex. | ||
116 | + * @return Array Um array com os elementos encontrados. | ||
117 | + */ | ||
118 | + this.getElementsByName = function(docObj, formId, fieldsName) { | ||
51 | var regex = new RegExp(fieldsName); | 119 | var regex = new RegExp(fieldsName); |
52 | - var form = docObj.getElementById(formId); | 120 | + var form = docObj.getElementById(formId); |
121 | + var matches = []; | ||
122 | + var matchId = 0; | ||
53 | 123 | ||
54 | for (var i = 0; i < form.elements.length; i++) { | 124 | for (var i = 0; i < form.elements.length; i++) { |
55 | var elementName = form.elements[i].name; | 125 | var elementName = form.elements[i].name; |
56 | if (null !== elementName.match(regex)) { | 126 | if (null !== elementName.match(regex)) { |
57 | - form.elements[i].checked = checker == 1 ? true : false; | 127 | + matches[matchId++] = form.elements[i]; |
58 | } | 128 | } |
59 | } | 129 | } |
130 | + | ||
131 | + return matches; | ||
60 | }; | 132 | }; |
61 | -}; | ||
62 | \ No newline at end of file | 133 | \ No newline at end of file |
134 | +}; |