wie mehrere select tags auf die erste option setzen

[magicslider]

hi,

ich verwende in einem frame 5 form tags mit jeweils einem select tag.
die optionen öffnen einen anderen frame.

sobald ich eine option in einem der 5 select tags ausgewählt habe,
möchte ich aber das alle anderen select tags auf die erste option
zurückgesetzt werden.

wie gehe ich das an ?

<form name='one'>
<select onChange='parent.bottom.location= this.options[this.selectedIndex].value ? this.options[this.selectedIndex].value : parent.bottom.location.href'>
<option value=''></option>
<option value='workspace.php?table=c'>c</option>
<option value='workspace.php?table=a'>a</option>
<option value='workspace.php?table=p'>p</option>
</select>
</form>

thx magicslider

[wahsaga]

hi,

ich verwende in einem frame 5 form tags mit jeweils einem select tag. [...]
sobald ich eine option in einem der 5 select tags ausgewählt habe,
möchte ich aber das alle anderen select tags auf die erste option
zurückgesetzt werden.

am simpelsten wohl mit einer schleife über die fünf formulare.
(wenn es insgesamt nur diese fünf formulare im dokument gibt, könntest du auch per for in einmal durch das forms-objekt laufen.)
darin dann jeweils den index des select wieder auf 0 setzen.

evtl. noch abfragen, ob das formular gleich dem aktuellen ist, um in diesem die auswahl bestehen zu lassen, wenn gewünscht.

btw: braucht es dafür eigentlich wirklich fünf einzelne formulare? würde es ein formular mit fünf selects nicht ggf. auch tun?

gruß,
wahsaga

[magicslider]

btw: braucht es dafür eigentlich wirklich fünf einzelne formulare? würde es ein formular mit fünf selects nicht ggf. auch tun?

hi wahsaga;

ich kann auch einen form tag daraus machen, was wäre dann einfacher ?
kannst du was den code angeht konkreter werden, javascript ist für
immer so was gewöhnungsbedürftiges...

thx magicslider

[wahsaga]

hi,

ich kann auch einen form tag daraus machen, was wäre dann einfacher ?

um's "einfacher" in bezug auf dein jetziges vorhaben ging es mir eher weniger; mehr um das einsparen von unnötigen elementen.

kannst du was den code angeht konkreter werden, javascript ist für
immer so was gewöhnungsbedürftiges...

zum eingewöhnen gibt es ja http://de.selfhtml.org/javascript/ ;-)

wo hast du denn konkret probleme?

mal ein paar sachen, die für das lösen dieser aufgabe geläufig sein sollten:
ansprechen von formularen
umgang mit dem options-objekt
schleifen (for, for in)

gruß,
wahsaga

[magicslider]

hi wahsaga,

langsam, mir fehlt noch der faden,...

also packe ich alles in ein form und gebe den select tags einen name

<form name='test'>
<select name='one' onChange='parent.bottom.location= this.options[this.selectedIndex].value ? this.options[this.selectedIndex].value : parent.bottom.location.href'>
<option value=''></option>
<option value='workspace.php?table=c'>c</option>
<option value='workspace.php?table=a'>a</option>
<option value='workspace.php?table=p'>p</option>
</select>
<select name='two' onChange='parent.bottom.location= this.options[this.selectedIndex].value ? this.options[this.selectedIndex].value : parent.bottom.location.href'>
<option value=''></option>
<option value='workspace.php?table=c'>c</option>
<option value='workspace.php?table=a'>a</option>
<option value='workspace.php?table=p'>p</option>
</select>
<select name='three' onChange='parent.bottom.location= this.options[this.selectedIndex].value ? this.options[this.selectedIndex].value : parent.bottom.location.href'>
<option value=''></option>
<option value='workspace.php?table=c'>c</option>
<option value='workspace.php?table=a'>a</option>
<option value='workspace.php?table=p'>p</option>
</select>
</form>

mein auslöser für das script ist nun was ?
ein onClick im option tag ? falls ja ist das zulässig ?
oder ein generelles onSubmit ?

dann zum script, die id des jeweiligen selects zu ermitteln ist mir klar, wenn es mit dem obClick in option tag zulässig ist, könnte ich 5 funktionen haben, dann muss ich mir keine gedanken machen wie ich ermittel in welchem select ich bin. naja ist nicht gerade elegant aber ein weg...

wie setze ich aber alle selects zurück, mir fallen im form tag bezogene resets ein, deshalb hatte ich ja 5 form tags...

ich hoffe du bringst licht in mein gedankengewirr...

thx magicslider

[wahsaga]

hi,

mein auslöser für das script ist nun was ?
ein onClick im option tag ? falls ja ist das zulässig ?
oder ein generelles onSubmit ?

du nutzt doch bereits onChange, um den wechsel der seite im frame auszulösen - also hänge das zurücksetzen der anderen selects doch einfach ebenfalls noch da mit rein.

wie setze ich aber alle selects zurück, mir fallen im form tag bezogene resets ein, deshalb hatte ich ja 5 form tags...

da du ausschließlich die fünf selects als formularelemente hast, sollte es m.E. ausreichen, einmal in einer schleife über den inhalt der elements-collection zu laufen:

var Anzahl = document.test.elements.length;
for(i=0; i<Anzahl; i++) {
  // in der schleife dann über
  // document.test.elements[i]
  // zugriff auf die selects
}

zum "zurücksetzen" eines select, wie schon gesagt, mal das options-objekt anschauen - selectedIndex bietet sich vermutlich am besten an.

dann zum script, die id des jeweiligen selects zu ermitteln ist mir klar, wenn es mit dem obClick in option tag zulässig ist, könnte ich 5 funktionen haben, dann muss ich mir keine gedanken machen wie ich ermittel in welchem select ich bin. naja ist nicht gerade elegant aber ein weg...

eben, und so unelegant wollen wir ja nicht werden.
du könntest also beim aufruf im onChange an deine funktion zum zurücksetzen einfach this als parameter übergeben, dann hast du die referenz auf das auslösende select.
und in deiner schleife vergleichst du dann einfach, ob das aktuell betrachtete select gleich dem in diesem parameter abgelegten ist - wenn nein, zurücksetzen, wenn ja, nichts tun.

gruß,
wahsaga

[magicslider]

hi wahsaga,

oh mann, das sind noch immer bömische dörfer für mich ???
habe ich dich insoweit richtig verstanden ?

<script type='text/javascript'>
  function reset_elements()
  {
  var Anzahl = document.test.elements.length;
    for(i=0; i<Anzahl; i++)
    {
      //hmmm so oder besser gesagt so ähnlich ???????
      if(document.test.elements[i].selectedIndex != 0 && document.test.elements[i].selectedIndex != this.options[this.selectedIndex].index)
      {
      document.test.elements[i].selectedIndex == 0;
      //hmmm setzt die funktion dadurch den index auf 0 ???
      }
    }
  parent.bottom.location= this.options[this.selectedIndex].value ? this.options[this.selectedIndex].value : parent.bottom.location.href;
  }
</script>

<form name='test'>
<select name='one' onChange='reset_elements();'>
<option value=''></option>
<option value='workspace.php?table=c'>c</option>
<option value='workspace.php?table=a'>a</option>
<option value='workspace.php?table=p'>p</option>
</select>
<select name='two' onChange='reset_elements();'>
<option value=''></option>
<option value='workspace.php?table=c'>c</option>
<option value='workspace.php?table=a'>a</option>
<option value='workspace.php?table=p'>p</option>
</select>
<select name='three' onChange='reset_elements();'>
<option value=''></option>
<option value='workspace.php?table=c'>c</option>
<option value='workspace.php?table=a'>a</option>
<option value='workspace.php?table=p'>p</option>
</select>
</form>

thx magicslider

[magicslider]

hi,

mache es jetzt so...

<script type='text/javascript'>
  function select_change(form_name)
  {
      if(form_name != 'one'){document.one.sel_one.selectedIndex = 0;}
      else
      {
      var link_id  = document.one.sel_one.selectedIndex;
      var link     = document.one.sel_one.options[link_id].value;
      }
      if(form_name != 'two'){document.two.sel_two.selectedIndex = 0;}
      else
      {
      var link_id  = document.two.sel_two.selectedIndex;
      var link     = document.two.sel_two.options[link_id].value;
      }
      if(form_name != 'three'){document.three.sel_three.selectedIndex = 0;}
      else
      {
      var link_id  = document.three.sel_three.selectedIndex;
      var link     = document.three.sel_three.options[link_id].value;
      }
      if(form_name != 'four'){document.four.sel_four.selectedIndex = 0;}
      else
      {
      var link_id  = document.four.sel_four.selectedIndex;
      var link     = document.four.sel_four.options[link_id].value;
      }
      if(form_name != 'five'){document.five.sel_five.selectedIndex = 0;}
      else
      {
      var link_id  = document.five.sel_five.selectedIndex;
      var link     = document.five.sel_five.options[link_id].value;
      }
  window.open(document.location.href.value=link ,'bottom');
  }
</script>

thx magicslider