Nieuwe select bij onSelect

[*Baia*]

Dag,

Ik kom er niet uit. Ik heb een select box met een aantal waardes. Het is de bedoeling dat, wanneer een bezoeker een keuze heeft gemaakt dezelfde selectbox er weer onder verschijnt als nieuwe optie. Kan iemand mij op weg helpen daar ik niet al te veel kaas van javascript gegeten heb?

SELECTBOX:
<select name='test[]' onSelect='nieuweselectbox()'>
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
<option value='4'>4</option>
</select>

Met vr. gr.
Jeroen

 

[Glest]

onselect is een event voor text die geselecteerd wordt. Wat jij wilt is het onchange event. Je hoort trouwens geen hoofdletters te gebruiken voor events.

Je moet dus zo iets doen:

<select name="test[]" onchange="selectChanged(this)">
  <option value="-1">Maak een keuze</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
</select><br />

<select name="test[]" onchange="selectChanged(this)">
  <option value="-1">Maak een keuze</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
</select><br />

<select name="test[]" onchange="selectChanged(this)">
  <option value="-1">Maak een keuze</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
</select><br />

<script type="text/javascript">
//<![CDATA[
var selectElements = document.getElementsByName("test[]");
for (var i = 0; i < selectElements.length; i++)
{
  selectElements[i].number = i;
  if (i > 0)
  {
    selectElements[i].style.display = "none";
  }
}

function selectChanged(select)
{
  if (select.options[select.selectedIndex].value > -1)
  {
    var newNum = select.number+1;
    if (newNum < selectElements.length)
      selectElements[select.number+1].style.display = "inline";
  }
}
//]]>
</script>

 

[*Baia*]

Bedankt voor je antwoord. Ik ga er mee aan de slag!

 

[Glest]

Graag gedaan

Het is trouwens wel belangrijk dat het script onder alle selects staat in de bron, anders is het niet te garanderen dat ze al bestaan wanneer het script draait.:thumb:

 

[*Baia*]

Dag Glest,

Natuurlijk erg bedankt alvast voor je antwoord, ik heb echter nog een andere vraag waarvan ik hoop dat je deze kan oplossen.

Ik heb een div met een aantal form elementen erin (welke middels php gegenereerd worden vanuit een database), zie hieronder, Nu is het eigenlijk de bedoeling dat ik wanneer ik op een <input type='submit' onclick='nieuwedivform()'> klik er een nieuwe div met exact dezelfde gegevens als hieronder verschijnt. Verder is het eigenlijk de bedoeling dat eventuele div blokken ook met een linkje weer verwijderd worden voordat deze gesubmit worden. Kan dit eventueel tegen betaling gerealiseerd worden?

<div class='test'>
<table>
<tr><td>Naam: </td><td><input type='text' name='naam'></td></tr>
<tr><td>Beroep: </td><td>
<select name='beroep[]'>
<option>Bakker</option>
<option>Slager</option>
<option>Bouwvakker</option>
</select>
</td></tr>
<tr><td>Beroep: </td><td>
<select name='plaats[]'>
<option>Plaats 1</option>
<option>Plaats 2</option>
<option>Plaats 3</option>
</select>
</td></tr>
</div>

Ik hoop dat je me kan helpen!