Ik heb een select box op mijn pagina staan. Nou wil ik graag dat als er een waarde geselecteerd wordt er een nieuwe select wordt toegevoegd aan mijn pagina (zonder dat deze pagina refreshed). Ik kan op google heel erg veel info vinden over options toevoegen aan bestaande selectboxes, options sorteren, selectbox aan elkaar hangen op basis van overeenkomstige waardes etc etc etc. Maar het lukt me niet iets te vinden over kopieren van of toevoegen van een nieuwe select. Kan iemand me op weg helpen?
javascript hoort thuis in w&g, en niet in p&w.
p&w->w&g.
p&w->w&g.
https://fgheysels.github.io/
zoiets?
code:
1
2
3
| var org = document.getElementById('de_select');
var new = org.cloneNode(true);
org.parentNode.appendChild(new); // of plak 'm ergens anders in je document |
Today's subliminal thought is:
Ik zal maybe wel iets fout doen, maar het plakken van deze code in mijn javascript heeft als resultaat dat al het javascript niet meer werkt in de pagina. Ik heb bij getelementbyid de id naam van de select opgegeven.
Bovenstaande code voegt een nieuw record toe met daarin 2 x td en 2 x een cell. Zoals je kunt zien wordt de cell 2 keer gevuld met een input van het type=text. Nou wil ik graag dat 1 van de twee cellen met een select wordt gevuld en niet met een input. Het liefst heb ik dat deze select een kopie is van een select box die al op de pagina voorkomt. Maar ik ben ook al heel blij als iemand mij kan vertellen hoe je met javascript een select maakt.
code:
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
| function get_input_cell(str_name) {
var obj_element = document.createElement('input');
obj_element.setAttribute('type', 'text');
obj_element.setAttribute('name', str_name);
obj_element.setAttribute('id', str_name);
obj_element.setAttribute('size', '25');
return obj_element;
}
// creates a label for an input element
function get_caption_cell(str_target, str_caption) {
var obj_element = document.createElement('label');
obj_element.innerHTML="<label for=\"" + str_target + "\">" + str_caption + "</label";
return obj_element;
}
function opt(str_option){
var theDayElement = window.document.frm.aangeboden_aan;
var myNewOption = new Option(str_option,theDayElement.length);
theDayElement.options[theDayElement.length] = myNewOption;
}
function regel_toevoegen() {
var int_rowcount = document.getElementById('rowcount').value;
int_rowcount++;
document.getElementById('rowcount').value = int_rowcount;
var obj_table = document.getElementById('bod');
var obj_row = obj_table.insertRow(obj_table.rows.length);
var obj_voornaam_caption_cell = obj_row.insertCell(0);
var obj_voornaam_input_cell = obj_row.insertCell(1);
var obj_achternaam_caption_cell = obj_row.insertCell(0);
var obj_achternaam_input_cell = obj_row.insertCell(1);
obj_voornaam_caption_cell.appendChild(get_caption_cell('bod' + int_rowcount,'Bod:'));
obj_voornaam_input_cell.appendChild(get_input_cell('aangeboden_aan' + int_rowcount));
obj_achternaam_caption_cell.appendChild(get_caption_cell('aangeboden' + int_rowcount,'Aaangeboden aan:'));
obj_achternaam_input_cell.appendChild(get_input_cell('aangeboden_voor' + int_rowcount));
document.getElementById('bod').className = 'grey';
document.getElementById('aangeboden_aan' + int_rowcount).className = 'layout';
document.getElementById('aangeboden_voor' + int_rowcount).className = 'layout';
} |
Bovenstaande code voegt een nieuw record toe met daarin 2 x td en 2 x een cell. Zoals je kunt zien wordt de cell 2 keer gevuld met een input van het type=text. Nou wil ik graag dat 1 van de twee cellen met een select wordt gevuld en niet met een input. Het liefst heb ik dat deze select een kopie is van een select box die al op de pagina voorkomt. Maar ik ben ook al heel blij als iemand mij kan vertellen hoe je met javascript een select maakt.
[ Voor 85% gewijzigd door Verwijderd op 25-09-2005 14:14 ]
De code die ik gaf, was uit de losse pols. En de variabelenaam new is wat ongelukkig gekozen (gereserveerde term)
, waarschijnlijk loopt-ie daar op vast.
Today's subliminal thought is: