Jag har en select som jag vill fylla med olika innehåll beroende på användarens val i radioknappar. Det beror på att du använder onchange... <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> Det hjälpte när jag bytte till onClick.fylla select med javascript
Har skapar en array med de värden som ska läsas in:
var arrOption = new Array();
arrOption [0] = new Array();
arrOption [0][0] = new Option("- Välj -","0");
arrOption [0][1] = new Option("Kalle","1");
arrOption [0][2] = new Option("Sven","2");
arrOption [1] = new Array();
arrOption [1][0] = new Option("- Välj -","0");
arrOption [1][1] = new Option("Anna","1");
arrOption [1][2] = new Option("Lena","2");
Gjorde sen en function för att läsa in till select boxen:
function reloadOption(valIndex)
// skicka med index för att avgöra vilken dimension av arrayen som ska fylla select boxen
{
// peka på sel_namn options arrayen (för att göra koden mer lättläst)
var arrNamn= document.form.sel_namn.options;
arrNamn.length = 0; // rensa befintliga options
// ladda nya options för den radio är vald (pojkar eller flickor)
for(var i=0; i<arrOption[valIndex].length; i++)
{
arrNamn.length++; // lägg till en ny option
arrNamn[arrNamn.length-1].text = arrOption[valIndex][i].text;
arrNamn[arrNamn.length-1].value = arrOption[valIndex][i].value;
}
return;
}
Formuläret har sen radio som anropar onchange:
<input type="radio" name="namn" value="pojkar" onchange="reloadOption(0)" /> Pojkar
<input type="radio" name="namn" value="flickor" onchange="reloadOption(1)" /> Flickor
Så långt fungerar allt MEN... om jag har flickor valda och har klickat fram tex Anna i selecten så rensas inte detta om jag byter radio till Pojkar förrän jag klickar på selecten en gång.
Hur gör jag för att uppdatera selecten till att stå på "Välj" när jag klickar på någon av radioknapparna?Sv: fylla select med javascript
Vad som händer är att du måste släppa focus från radio knappen för att den ska uppdatera.
Om du kör en kontroll på värdet som kommer in i funktionen som du aktiverar genom onClick tex så kan du se om du ska genomföra en förändring av värdena i selecten eller inte.Sv: fylla select med javascript
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
</HEAD>
<script>
var arrOption = new Array();
var curr_choice = -1;
arrOption [0] = new Array();
arrOption [0][0] = new Option("- Välj -","0");
arrOption [0][1] = new Option("Kalle","1");
arrOption [0][2] = new Option("Sven","2");
arrOption [1] = new Array();
arrOption [1][0] = new Option("- Välj -","0");
arrOption [1][1] = new Option("Anna","1");
arrOption [1][2] = new Option("Lena","2");
function reloadOption(valIndex)
// skicka med index för att avgöra vilken dimension av arrayen som ska fylla select boxen
{
// peka på sel_namn options arrayen (för att göra koden mer lättläst)
if(curr_choice != valIndex){
curr_choice = valIndex;
var arrNamn= document.form.sel_namn.options;
arrNamn.length = null; // rensa befintliga options
// ladda nya options för den radio är vald (pojkar eller flickor)
for(var i=0; i<arrOption[valIndex].length; i++)
{
arrNamn.length++; // lägg till en ny option
arrNamn[arrNamn.length-1].text = arrOption[valIndex][i].text;
arrNamn[arrNamn.length-1].value = arrOption[valIndex][i].value;
}
return;
}
}
</script>
<BODY>
<form name="form">
<input type="radio" name="namn" value="pojkar" onClick="reloadOption(0)" /> Pojkar
<input type="radio" name="namn" value="flickor" onClick="reloadOption(1)" /> Flickor
<select name="sel_namn">
<option value=""></option>
</select>
</form>
</BODY>
</HTML>Sv: fylla select med javascript
Tack snälla för hjälpen!
/Lena