Dynamische Dropdown-Liste

[remopeter]

Hallo zus

ich möchte auf meiner seite eine dropdownliste einfügen, welche sich beim öffnen automatisch auf den längsten eintrag vergrössert vergrössert.

Beispiel: die grösse (breite) der liste im ungeöffneten zustand ist 200px. der längste eintrag ist aber 400px breit. beim runterklappen der liste kann nicht der ganze eintrag gelesen werden.

wie kann ich es bewerkstelligen, dass sich die grösse beim aufklappen so anpasst,dass ich den längsten eintrag lesen kann?

Gruss aus Bern

[kills]

Hi,

hm, ist das nicht das Default verhalten dieser boxen?

Gruß,

Markus

[remopeter]

nicht ganz! wenn die breite festgelegt wird (200px) ist die breite so wie sie festgelegt wurde. ich möchte nicht, dass eine liste 150px, eine zweite 180px und eine dritte 50px hat, d.h. sich der länge der einträge anpasst.

[Krain]

nicht ganz! wenn die breite festgelegt wird (200px) ist die breite so wie sie festgelegt wurde. ich möchte nicht, dass eine liste 150px, eine zweite 180px und eine dritte 50px hat, d.h. sich der länge der einträge anpasst.

Ich denke ich weiß was du meinst, das Problem hatte ich auch schon.

Ich habe es damit geregelt, dass ich dem Select selbst eine feste width zugeteilt habe, den einzelnen options allerding width:auto.

Damit wird der Select selbst in der gewünschten Größe dargestellt, die Options werden dann aber nach Bedarf vergrößert.

Dies funktionierte aber nur im Firefox, soweit ich weiß. Der IE hat sich dagegen geweigert.

[kills]

Dies funktionierte aber nur im Firefox, soweit ich weiß. Der IE hat sich dagegen geweigert.

Jep, hab ich grad getestet,

[remopeter]

schade! leider verwende ich ausschliesslich IE. das ist eine Vorgabe des Projektes. gibt es sonst keine möglichkeit?

[Krain]

Höchstens ein eigenes Steuerelement basteln. Da wirst du aber wahrscheinlich um viel CSS und vielleicht sogar JavaScript nicht rumkommen.

[kills]

schonma sowas versucht:

<select name="ab" style="width: 50px">

 <option style="width: 150px">asd</option>

</select>

?

Somit ist die länge der Optionen wahrscheinlich nicht dynamisch, aber destotrotz bereiter als die Select Box.

Ist ungetestet!

Gruß,

Markus

[remopeter]

schonma sowas versucht:

<select name="ab" style="width: 50px">

 <option style="width: 150px">asd</option>

</select>

?

Somit ist die länge der Optionen wahrscheinlich nicht dynamisch, aber destotrotz bereiter als die Select Box.

Ist ungetestet!

Gruß,

Markus

Doch! Aber das funzt mit IE nicht. Mit Firefox geht's. Ich suche eine Lösung für IE. sie muss auch nur für IE funktionieren.

[kills]

hm, du könntest evtl. beim öffnen der drop down Liste per JavaScript, die style.width angabe entfernen und beim wiederzuklappen erneut einhängen?

Gruß,

Markus

[remopeter]

Hallo zus

Ich habe mich da nochmals drum gekümmert. leider hab ich immer noch probleme. ich versuche folgendes. beim klick auf die besagte select-box kreiere ich einen neuen layer. in diesen layer fülle ich die vergrösserte selectbox.

nun habe ich das problem, dass die selectbox nicht an der richtigen position erscheint. ich möchte sie gerne ganau über der kleinen selectbox.

das zweite problem ist, dass ich möchte, dass sich die vergrösserte box automatisch beim verlassen wieder schliesst, und dass die kleine box wieder angezeigt wird. kann mir da jemand einen tip geben?

der code sieht wir folgt aus:

function selectdivOLD(id)

{

	if (!document.all.mydiv)

	{

		code = '<div id="mydiv" style="position:absolute;visibility:shown;"></div>';

		document.body.insertAdjacentHTML('beforeEnd', code);

	}

	var myselect = document.getElementById(id);

	myselect.style.width="400px";

	document.all.mydiv.style.top=window.event.clientY-10;

	document.all.mydiv.style.left=window.event.clientX-390;

	mydiv.appendChild(myselect);

}


<td><select id="test" onmousedown="selectdivOLD(this.id)" class="select">

	<option value="0"></option>

	<option value="0">abd sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf</option>

	<option value="0"></option>

	</select>

</td>