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
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
| var linesCount = 0;
// Création d'une liste select et de ses options
function makeOptions(optionValues, optionTextes=optionValues) {
var options = [];
var text, i;
var max = optionValues.length;
for (i=0; i<max; i++) {
if (optionValues[i] == 'optgroup') {
// inutilisé, non au point
options[i] = document.createElement('optgroup');
options[i].label = optionValues[i+1];
// Lien parent non défini
options[i].parentNode.insertBefore(options[i], options[i+1]);
}
else {
text = document.createTextNode(optionTextes[i]);
options[i] = document.createElement('option');
options[i].value = optionValues[i];
options[i].appendChild(text);
}
}
return options;
}
// Ajout d'une colonne de table
function addField(tagType='selectTag'){
//Options possibles pour tagType: selectTag, textareaTag, textTag
// On incrémente le compteur ci-dessus
linesCount++;
// On récupère le tableau
var container = document.getElementById('list');
// On crée les variables nécessaires à la constitution de la ligne
var line = document.createElement('tr');
var cells = [];
var elements = ['field', 'bold', 'italic', 'family', 'size', 'color', 'del'];
var tag;
switch (tagType) {
case 'selectTag': tag = 'select'; break;
case 'textTag': tag = 'text'; break;
case 'textareaTag': tag = 'textarea'; break;
}
var types = [tag, 'checkbox', 'checkbox', 'select', 'number', 'select', 'checkbox'];
var max = elements.length;
var fields = [];
var i = 0;
var k, xMax, arrOptions;
// Création et insertion de la ligne
container.appendChild(line);
// Création des balises interne à la ligne
for (i=0; i<max; i++) {
k=i+1;
switch (types[i]) {
case 'checkbox':
fields[i] = document.createElement('input');
fields[i].id = '['+k+']'+elements[i];
fields[i].setAttribute('name', fields[i].id);
fields[i].setAttribute('type', 'checkbox');
break;
case 'number':
fields[i] = document.createElement('input');
fields[i].id = '['+k+']'+elements[i];
fields[i].setAttribute('name', fields[i].id);
fields[i].setAttribute('type', 'number');
// Données particulières à ce champ
fields[i].min = 8;
fields[i].max = 36;
fields[i].value =12;
break;
case 'text':
fields[i] = document.createElement('input');
fields[i].id = '['+k+']'+elements[i];
fields[i].setAttribute('name', fields[i].id);
fields[i].setAttribute('type', 'text');
break;
default:
fields[i] = document.createElement(types[i]);
fields[i].id = '['+k+']'+elements[i];
fields[i].name = fields[i].id;
break;
}
}
// Contenu des listes
// Liste tables (la variable tables est créée dans le script php
//var optionValues = ['toto', 'tata']; // Pour essais
arrOptions = makeOptions(optionValues, optionTextes);
xMax = optionValues.length;
fields[0].appendChild(arrOptions[xMax-1]);
for (i=xMax-1; i>=0; i--) {
fields[0].insertBefore(arrOptions[i], arrOptions[i+1]);
}
fields[0].selectedIndex = 0;
// Liste family
var families = ['Courier', 'Arial', 'Comic', 'Helvetica', 'Times'];
arrOptions = makeOptions(families);
xMax = families.length;
fields[3].appendChild(arrOptions[xMax-1]);
for (i=xMax-1; i>=0; i--) {
fields[3].insertBefore(arrOptions[i], arrOptions[i+1]);
}
fields[3].selectedIndex = 1;
// Champ color
var colors = ['red','blue','green','yellow','black','white','salmon','silver','gray','navy'];
arrOptions = makeOptions(colors);
xMax = colors.length;
fields[5].appendChild(arrOptions[xMax-1]);
for (i=xMax-1; i>=0; i--) {
fields[5].insertBefore(arrOptions[i], arrOptions[i+1]);
}
fields[5].selectedIndex = 4;
// Suppression de la ligne sur click de 'del'
fields[6].onclick = function() {
container.removeChild(line);
}
for (i=max-1; i>=0; i--) {
cells[i] = document.createElement('td');
if (i == max-1) {
cells[i].appendChild(fields[i]);
line.appendChild(cells[i]);
}
else {
cells[i].appendChild(fields[i]);
line.insertBefore(cells[i], cells[i+1]);
}
}
container.appendChild(line);
}
// Ajout d'un saut de ligne
function addLine() {
// On incrémente le compteur du début
linesCount++;
var container = document.getElementById('list');
var line = document.createElement('tr');
var cells = [];
cells[1] = document.createElement('td');
cells[1].appendChild(document.createElement('hr'));
cells[1].setAttribute('colspan', 7);
line.appendChild(cells[1]);
cells[2] = document.createElement('input');
cells[2].id = '['+'1'+']'+'CRLN';
cells[2].setAttribute('name', cells[2].id);
cells[2].setAttribute('type', 'hidden');
cells[2].value = 'CRLN';
line.appendChild(cells[2]);
container.appendChild(line);
} |
