mit javascript select option vorwählen

[piet]

Hallo,

ich möchte per javascript bei allen Auswahlfeldern jeweils eine Option umschalten. d.h. Beim drücken einer Taster, oder Seitenaufruf, möchte ich alle Auswahlboxen mit einer "Standardoption" anzeigen lassen.

Wie kann ich aber jeweils über eine Schleife auf die jeweilige option zugreifen. Hie mal mein HTML Code

<tbody>
  <tr>
    	<td>1</td>
    	<td>T1</td>
    	<td align="center">11</td>
    	<td>DB100_DW0</td>
	<td align="center">
		<select name="T1_DB100_DW0" size="1" onblur="aktiv(name);">
		    <option value="BOOL" >BOOL</option>
		    <option value="DEZ32" >DEZ32</option>
		    <option value="DEZ16" >DEZ16</option>
		    <option value="HEX16">HEX16</option>
		    <option value="HEX32" >HEX32</option>
		    <option value="REAL" selected>REAL</option>
		    <option value="BIN8">BIN8</option>
		    <option value="BIN16">BIN16</option>
		    <option value="BIN32">BIN32</option>
		</select>
    	</td>
	<td id="T1_DB100_DW0">0</td>
  </tr>
  <tr>
    	<td>1</td>
    	<td>T1</td>
    	<td align="center">11</td>
    	<td>DB100_DW16</td>
	<td align="center">
		<select name="T1_DB100_DW16" size="1" onblur="aktiv(name);">
		    <option value="BOOL" >BOOL</option>
		    <option value="DEZ32" >DEZ32</option>
		    <option value="DEZ16" >DEZ16</option>
		    <option value="HEX16">HEX16</option>
		    <option value="HEX32" >HEX32</option>
		    <option value="REAL" selected>REAL</option>
		    <option value="BIN8">BIN8</option>
		    <option value="BIN16">BIN16</option>
		    <option value="BIN32">BIN32</option>
		</select>
    	</td>
	<td id="T1_DB100_DW16">0</td>
  </tr>

Der HTML-Code (Webseite) wird dynamisch erzeugt. Falls nötig könnte ich bei "select" z.B. eine id mit fortlaufender Nummer einbauen. Das würde ich aber nur machen wenn es anders Nachteile gibt.

Wie gesagt möchte ich z.B. die Option

<option value="DEZ16" >DEZ16</option>

als Vorauswahl mit Javascript aktivieren, obwohl in html Code

<option value="REAL" selected>REAL</option>

vorgewählt ist.

Nur zu Info: es gibt auf der Webseite 30 mögliche Auswahlfelder die einzeln verstellt werden können, um diese alle wieder auf ein bestimmtes Format zu bekommen, soll diese Funktion "Standardvorwahl" eingebaut werden.

So ... viel Info. Vermutlich ganz einfach, aktuell für mich nicht ;-)

Gruß piet

[Orlok]

Hallo

Wie gesagt möchte ich z.B. die Option

<option value="DEZ16" >DEZ16</option>

als Vorauswahl mit Javascript aktivieren, obwohl in html Code

<option value="REAL" selected>REAL</option>

vorgewählt ist.

Die ausgewählte option ist der Wert der Eigenschaft value des Elternelementes select.

console.info(select.value); // REAL

select.value = 'DEZ16';

console.info(select.value); // DEZ16

Wenn du value eine option zuweist, dann wird diese entsprechend ausgewählt.

Gruß,

Orlok

[piet]

Hallo

Die ausgewählte option ist der Wert der Eigenschaft value des Elternelementes select.

select.value = 'DEZ16';

Gruß,

Orlok

Hallo,

ooookay, das ist (jetzt) klar. Ich suche die Schleifenabfrage, damit ich alle "select" ohne bekannte "id" und "name" (der select) finde, um dann den wert (value) auf die "gefundene select" z.B. 'DEZ16' schreibe.

So nach dem Motto

for i, i < alleselect innerhalb der "table"
     select(i).value = 'DEZ16';
next

Ich hoffe ich konnte es erklären ;-)

Danke piet

[Orlok]

Hallo

So nach dem Motto

for i, i < alleselect innerhalb der "table"
     select(i).value = 'DEZ16';
next

So richtig klar ist mir noch nicht, was du meinst, aber du kannst dir beispielsweise mittels der Dokumentmethode querySelectorAll und einem entsprechenden CSS Selektor, den du der Methode als String übergibst, eine NodeList der select-Elemente ausgeben lassen, welche Nachfahren von table sind:

// sobald die Seite fertig geparst ist ...

window.addEventListener('DOMContentLoaded', function ( ) {

  // speichere alle select Elemente die Nachfahren einer table sind in der Variable list ...
  var list = document.querySelectorAll('table select');

  // und weise der Eigenschaft value von jedem select in list den Wert DEZ16 zu
  [].forEach.call(list, function (select) {
    select.value = 'DEZ16';
  });

});

Um über die Einträge von list zu iterieren verwende ich hier die Array-Methode forEach, da diese in meinen Augen etwas eleganter ist als die klassische for-Schleife, an die du hier wohl dachtest, obwohl es damit natürlich auch ginge.

Da es sich bei dem Rückgabewert von querySelectorAll um eine NodeList handelt und nicht um ein Array, die Methode forEach also eigentlich nicht auf list ausgeführt werden kann, erzeuge ich hier im Beispiel in Literalschreibweise erst ein leeres Array und rufe dann dessen Methode forEach mittels call für die in list hinterlegte NodeList auf.

Im Ergebnis wird dann allen select-Elementen, die Nachfahren eines table-Elements sind, als Auswahl die option mit dem Wert DEZ16 zugewiesen. Wenn du nur diejenigen select-Elemente selektieren willst, die Nachfahren einer bestimmten table sind, dann wäre der Selektor für die Methode querySelectorAll entsprechend anzupassen …

Gruß,

Orlok

[piet]

Hallo Orlok,

super, das ist genau das was ich gesucht habe.....suuuuuper. Sofort mit einer Taste eigebaut .... ich komme sehr gerne zu diesem Forum ... schnell und effizient.

Gruß und Dank aus der Oberpfalz (Bayern)

piet

[Matthias Apsel]

Hallo piet,

super, das ist genau das was ich gesucht habe.....suuuuuper.

Dann könntest du die Antwort jetzt akzeptieren. Dann bekommt Orlok verdiente Punkte und künftige Leser sehen sofort, dass es eine sehr hilfreiche Antwort gab.

Bis demnächst
Matthias