|
@@ -2,10 +2,10 @@ function generateForm(id) {
|
2
|
2
|
var el = document.getElementById(id);
|
3
|
3
|
|
4
|
4
|
var input = {
|
5
|
|
- name: getField('form_name', 'Your name', false), // TODO: configurable prefix
|
6
|
|
- addr: getField('form_addr', 'Your e-mail address', true),
|
7
|
|
- subj: getField('form_subj', 'Your mail\'s subject', false),
|
8
|
|
- text: {}
|
|
5
|
+ name: getField('form_name', 'Your name', false, 'input'), // TODO: configurable prefix
|
|
6
|
+ addr: getField('form_addr', 'Your e-mail address', true, 'input'),
|
|
7
|
+ subj: getField('form_subj', 'Your message\'s subject', false, 'input'),
|
|
8
|
+ text: getField('form_text', 'Your message', false, 'textarea')
|
9
|
9
|
};
|
10
|
10
|
|
11
|
11
|
// Adding nodes to document
|
|
@@ -13,6 +13,11 @@ function generateForm(id) {
|
13
|
13
|
el.appendChild(input.name);
|
14
|
14
|
el.appendChild(input.addr);
|
15
|
15
|
el.appendChild(input.subj);
|
|
16
|
+ el.appendChild(input.text);
|
|
17
|
+
|
|
18
|
+ // Adding submit button
|
|
19
|
+
|
|
20
|
+ el.appendChild(getSubmitButton('form_subm', 'Send the mail'));
|
16
|
21
|
}
|
17
|
22
|
|
18
|
23
|
|
|
@@ -20,13 +25,14 @@ function generateForm(id) {
|
20
|
25
|
// id: field HTML identifier
|
21
|
26
|
// placeholder: placeholder text
|
22
|
27
|
// email: boolean: is it an email field?
|
|
28
|
+// type: 'input' or 'textarea'
|
23
|
29
|
// return: a div node containing a label and an input text field
|
24
|
|
-function getField(id, placeholder, email) {
|
|
30
|
+function getField(id, placeholder, email, type) {
|
25
|
31
|
var field = document.createElement('div');
|
26
|
32
|
|
27
|
33
|
field.setAttribute('id', id); // TODO: configurable prefix
|
28
|
|
- field.appendChild(getLabel(id, placeholder));
|
29
|
|
- field.appendChild(getInputField(id, placeholder, email));
|
|
34
|
+ field.appendChild(getLabel(id, placeholder, type));
|
|
35
|
+ field.appendChild(getInputField(id, placeholder, email, type));
|
30
|
36
|
|
31
|
37
|
return field;
|
32
|
38
|
}
|
|
@@ -35,11 +41,12 @@ function getField(id, placeholder, email) {
|
35
|
41
|
// Returns a label
|
36
|
42
|
// id: field HTML identifier
|
37
|
43
|
// content: label's inner content
|
|
44
|
+// type: 'input' or 'textarea'
|
38
|
45
|
// return: a label node the field's description
|
39
|
|
-function getLabel(id, content) {
|
|
46
|
+function getLabel(id, content, type) {
|
40
|
47
|
var label = document.createElement('label');
|
41
|
48
|
|
42
|
|
- label.setAttribute('for', id + '_input');
|
|
49
|
+ label.setAttribute('for', id + '_' + type);
|
43
|
50
|
label.innerHTML = content;
|
44
|
51
|
|
45
|
52
|
return label;
|
|
@@ -50,20 +57,47 @@ function getLabel(id, content) {
|
50
|
57
|
// id: field HTML identifier
|
51
|
58
|
// placeholder: placeholder text, field description
|
52
|
59
|
// email: boolean: is it an email field?
|
|
60
|
+// type: 'input' or 'textarea'
|
53
|
61
|
// return: an input text or email field (depending on "email"'s value') with an
|
54
|
62
|
// HTML id and a placeholder text
|
55
|
|
-function getInputField(id, placeholder, email) {
|
56
|
|
- var input = document.createElement('input');
|
|
63
|
+function getInputField(id, placeholder, email, type) {
|
|
64
|
+ var input = document.createElement(type);
|
57
|
65
|
|
58
|
|
- if(email) {
|
59
|
|
- input.setAttribute('type', 'mail');
|
60
|
|
- } else {
|
61
|
|
- input.setAttribute('type', 'text');
|
|
66
|
+ if(!type.localeCompare('input')) { // Set input type if input
|
|
67
|
+ if(email) {
|
|
68
|
+ input.setAttribute('type', 'mail');
|
|
69
|
+ } else {
|
|
70
|
+ input.setAttribute('type', 'text');
|
|
71
|
+ }
|
62
|
72
|
}
|
63
|
73
|
|
64
|
74
|
input.setAttribute('required', 'required');
|
65
|
75
|
input.setAttribute('placeholder', placeholder);
|
66
|
|
- input.setAttribute('id', id + '_input');
|
|
76
|
+ input.setAttribute('id', id + '_' + type);
|
67
|
77
|
|
68
|
78
|
return input;
|
|
79
|
+}
|
|
80
|
+
|
|
81
|
+
|
|
82
|
+// Returns a submit button
|
|
83
|
+// id: button HTML identifier
|
|
84
|
+// text: button text
|
|
85
|
+// return: a div node containing the button
|
|
86
|
+function getSubmitButton(id, text) {
|
|
87
|
+ var submit = document.createElement('div');
|
|
88
|
+
|
|
89
|
+ submit.setAttribute('id', id);
|
|
90
|
+
|
|
91
|
+ var button = document.createElement('button');
|
|
92
|
+
|
|
93
|
+ button.setAttribute('type', 'submit');
|
|
94
|
+ button.setAttribute('id', id);
|
|
95
|
+ // Disable button's default action
|
|
96
|
+ button.setAttribute('onSubmit', 'return false;');
|
|
97
|
+
|
|
98
|
+ button.innerHTML = text;
|
|
99
|
+
|
|
100
|
+ submit.appendChild(button);
|
|
101
|
+
|
|
102
|
+ return submit;
|
69
|
103
|
}
|