Optionen Tauschen

Schritt 1:
Per new Option()Ein neues option-Object erzeugen und mit text/value der zu verschiebenden Option belegen.

Schritt2.
Zu verschiebende Option aus der Liste 1 löschen, indem du ihr den Wert [null zuweist.

Schritt 3.
das in Schritt 1 erzeugte Object ans Ende der Liste2 ranhängen.


Mehr zu dem Thema:
 
Du kannst dir das neue Option-Objekt auch sparen, indem du gleich das alte
an die andere Liste anhängst.

Bsp:
Code:
<script type="text/javascript">

function swapOptions(a_sForm, a_sSel1, a_sSel2)
{
    oForm = window.document.forms[a_sForm];
    oSel1 = oForm.elements[a_sSel1];
    oSel2 = oForm.elements[a_sSel2];

    oSel2.options[oSel2.options.length] = oSel1.options[oSel1.selectedIndex];
    oSel1.options[oSel1.selectedIndex]  = null;
}

</script>


<form name="FooForm">
  <div style="width:160px; float:left; text-align:center;">
    <select name="Sel1" size="6" style="width:150px;">
      <option value="val1">Eintrag 1</option>
      <option value="val2">Eintrag 2</option>
      <option value="val3">Eintrag 3</option>
      <option value="val4">Eintrag 4</option>
    </select>
    <br />  
    <br />  
    <input type="button" value="&gt;&gt;"
           onclick="swapOptions('FooForm', 'Sel1', 'Sel2');" />
  </div>  
  <div style="width:160px; float:left; text-align:center;">
    <select name="Sel2" size="6" style="width:150px;">
      <option value="1lav">1 gartniE</option>
      <option value="2lav">2 gartniE</option>
      <option value="3lav">3 gartniE</option>
      <option value="4lav">4 gartniE</option>
    </select>
    <br />  
    <br />  
    <input type="button" value="&lt;&lt;"
           onclick="swapOptions('FooForm', 'Sel2', 'Sel1');" />
  </div>  
</form>
 
Hmm, komisch bei mir kommt die Fehlrmeldung das Objekt unterstütz die Eigenschaft oder Methode nicht.
 
Zuletzt bearbeitet:

Neue Beiträge

Zurück