Lets say i have function with id paremeter and two select box
<select id="one" onchange="Fill(2)"></select>
<select id="two" onchange="Fill(3)"></select>
<select id="three"></select>
My function
function Fill(id){
//some manupulation
$('<option/>').val(substr[0]).html(substr[1]).appendTo('#two');
}
But instead of doing many
if(id==2) {$('<option/>').val(substr[0]).html(substr[1]).appendTo('#two');}
if(id==3) {$('<option/>').val(substr[0]).html(substr[1]).appendTo('#three');}
i want something like
$('<option/>').val(substr[0]).html(substr[1]).appendTo(DYNAMIC);
Lets say i have function with id paremeter and two select box
<select id="one" onchange="Fill(2)"></select>
<select id="two" onchange="Fill(3)"></select>
<select id="three"></select>
My function
function Fill(id){
//some manupulation
$('<option/>').val(substr[0]).html(substr[1]).appendTo('#two');
}
But instead of doing many
if(id==2) {$('<option/>').val(substr[0]).html(substr[1]).appendTo('#two');}
if(id==3) {$('<option/>').val(substr[0]).html(substr[1]).appendTo('#three');}
i want something like
$('<option/>').val(substr[0]).html(substr[1]).appendTo(DYNAMIC);
-
1
I'm not entirely sure, hence the ment, but it looks like you just want to append the new
optionto the currently-changed element? So...wouldn't$('<option />').val(/*..*/).html(/*..*/).appendTo($(this));work? – David Thomas Commented May 21, 2012 at 16:19
5 Answers
Reset to default 6You could make it much easier by using ids such as select-1, select-2 etc. and then use '#select-' + id.
Otherwise you need a mapping object which maps from digits to spelled numbers.
function Fill(id){
var index = {
1: 'one',
2: 'two',
3: 'three';
};
$('<option/>').val(substr[0]).html(substr[1]).appendTo('#' + index[id]);
// or just, but in this case you need to change the *id* pattern like opt_1, opt_2 etc
$('<option/>').val(substr[0]).html(substr[1]).appendTo('#opt_' + id);
}
easier than you think :)
<select id="select-1" onchange="Fill(2)"></select>
<select id="select-2" onchange="Fill(3)"></select>
<select id="select-3"></select>
function Fill(id){ //
//some manupulation
$('<option/>').val(substr[0]).html(substr[1]).appendTo('select-' + id);
}
I'm going to go with David Thomas' suggestion:
<select id="one" onchange="Fill(this);"></select>
<select id="two" onchange="Fill(this);"></select>
<select id="three"></select>
With the Fill function defined as:
function Fill(select) {
$('<option />').val(/*..*/).html(/*..*/).appendTo($(select));
}
You would then be able to give your selects whatever id that you want, and you would not have to query the DOM to find the object.
Add this line to the top of Fill function:
var DYNAMIC = $(this);