dynamsiches Optionsfeld VS. Firefox ???

[devJunk]

Hi,

ich habe eine Funktion, die Optionsfelder teilweise dynamisch erstellt :

function optionsfeld($art, $start, $ende){
if ($art == "alter"){
for ($i=$start;$i<=$ende;$i++){
$ausgabe.='<option value="'.$i.'">'.$i.'</option>'.chr(10);
}
echo $ausgabe;
}
} 

Bisher werden halt nur Zahlen von Start -> Ende generiert.

eingebunden wird das ganze dann so:

<select name="s_alter_von" class="quicksuche_input2" id="s_alter_von">
[PHP]
<?php 
optionsfeld("alter",14,99);
?>
[/PHP]
</select

Seltsamerweise funktioniert die Anzeige der so generierten Felder aber nur im IE, Firefox zeigt überhaupt kein Feld an ??? Hat jemand eine Ahnung, woran das liegen könnte ?

[jahlives]

Wie sieht der HTML Quellcode aus ?

Gruss

tobi

[devJunk]

Das ist der Code aus Firefox :

<td valign="bottom" class="text_quicksuche">
					<select name="s_alter_von" class="quicksuche_input2" id="s_alter_von">
                    <option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>

<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>

<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
<option value="32">32</option>
<option value="33">33</option>
<option value="34">34</option>
<option value="35">35</option>

<option value="36">36</option>
<option value="37">37</option>
<option value="38">38</option>
<option value="39">39</option>
<option value="40">40</option>
<option value="41">41</option>
<option value="42">42</option>
<option value="43">43</option>
<option value="44">44</option>

<option value="45">45</option>
<option value="46">46</option>
<option value="47">47</option>
<option value="48">48</option>
<option value="49">49</option>
<option value="50">50</option>
<option value="51">51</option>
<option value="52">52</option>
<option value="53">53</option>

<option value="54">54</option>
<option value="55">55</option>
<option value="56">56</option>
<option value="57">57</option>
<option value="58">58</option>
<option value="59">59</option>
<option value="60">60</option>
<option value="61">61</option>
<option value="62">62</option>

<option value="63">63</option>
<option value="64">64</option>
<option value="65">65</option>
<option value="66">66</option>
<option value="67">67</option>
<option value="68">68</option>
<option value="69">69</option>
<option value="70">70</option>
<option value="71">71</option>

<option value="72">72</option>
<option value="73">73</option>
<option value="74">74</option>
<option value="75">75</option>
<option value="76">76</option>
<option value="77">77</option>
<option value="78">78</option>
<option value="79">79</option>
<option value="80">80</option>

<option value="81">81</option>
<option value="82">82</option>
<option value="83">83</option>
<option value="84">84</option>
<option value="85">85</option>
<option value="86">86</option>
<option value="87">87</option>
<option value="88">88</option>
<option value="89">89</option>

<option value="90">90</option>
<option value="91">91</option>
<option value="92">92</option>
<option value="93">93</option>
<option value="94">94</option>
<option value="95">95</option>
<option value="96">96</option>
<option value="97">97</option>
<option value="98">98</option>

<option value="99">99</option>
					</select>

Das gleiche noch mal mit einem kleineren Feld, welches auch nicht angezeigt wird ....

<td valign="bottom" class="text_quicksuche"><select name="s_plz_von" class="quicksuche_input2" id="s_plz_von">
                    <option value="0" selected>0</option>
                    <option value="1">1</option>

                    <option value="2">2</option>
                    <option value="3">3</option>
                    <option value="4">4</option>
                    <option value="5">5</option>
                    <option value="6">6</option>
                    <option value="7">7</option>

                    <option value="8">8</option>
                    <option value="9">9</option>
                  </select>

Ich kann da irgendwie keinen Fehler entdecken....aber Firefox scheint die Felder einfach zu ignorieren ...

[mrhappiness]

Zeigt der IE irgendwas in der Zelle der Tabelle an?

[jahlives]

Ein <form> hast du schon drumgepackt ?

[devJunk]

Ja, das ist ja gerade das was mich verwundert... Im IE wird alles so dargestellt, wie es sein soll. Ich habe auch schon gegoogelt, aber nichts brauchbares gefunden ....

[mrhappiness]

Pack mal den HTML-Code der kompletten Seite in eine Datei und hänge sie hier an

[devJunk]

Ja, ein <form> ist auch schon drin....
<code>
<form name="quicksearch" method="post" action="" class="formular">
...
</form>
</code>

Was ich nicht verstehe ist, ich habe im Formular auch manuell hinzugefügte Optionsfelder drin, die ganz normal angezeigt werden ....

[jahlives]

Haste den gesamten HTML Code mal validieren lassen ? Der IE kann z.T. sehr nachlässig sein, wenn es um falsches HTML geht und zeigt sehr oft noch Sachen an die andere Browser schlicht übergehen...

Gruss

tobi

[devJunk]

Ok, hier ist der Quellcode mal im Anhang ...

[jahlives]

Der Validator vom w3 spuckt hier 164 Fehler aus. Das meiste sind fehlende alt Attribute bei Bildern. Das ist nicht weiter schlimm. Es hat aber auch noch einige Fehler von doppelt und dreifach verwendeten ID's.
Könnte mir vorstellen, dass dies das Prob sein könnte.

Gruss

tobi

[Kropff]

also wenn ich das durch den w3c-validator jage, gibt es fehler bis zum abwinken.

gruß
peter

[mrhappiness]

Ich sehe die Optionsfelder in meinem Firefox (Version 1.5.0.5).

Siehst du sie, wenn du das Stylesheet (das wir ja nicht haben), nicht verwendest?

[devJunk]

Hmm....stimmt....wenn ich die Stylesheet-Datei nicht angebe, werden die Felder angezeigt ... Was stimmt denn nicht an dem CSS ???

body {
	margin-left: 20px;
	margin-top: 0px;
}
body,td,th {
	font-family: Tahoma;
	font-size: 12px;
	color: #676767;
}
.input2 {
	font-family: Tahoma;
	font-size: 12px;
	font-weight: normal;
	color: #999999;
	text-decoration: none;
	width: 110px;
}

a:link {
	font-family: Tahoma;
	font-size: 12px;
	font-style: normal;
	font-weight: normal;
	color: #C50032;
	text-decoration: underline;
}
a:visited {
	font-family: Tahoma;
	font-size: 12px;
	font-style: normal;
	font-weight: normal;
	color: #C50032;
	text-decoration: underline;
}
a:hover {
	font-family: Tahoma;
	font-size: 12px;
	font-style: normal;
	font-weight: normal;
	color: #C50032;
	text-decoration: none;
}
.text_quicksuche .formular a {
	font-family: Tahoma;
	font-size: 11px;
	font-weight: normal;
	color: #C2012E;
	text-decoration: underline;
	text-indent: 2px;
}
.text_quicksuche .formular a:hover {
	font-family: Tahoma;
	font-size: 11px;
	font-weight: normal;
	color: #C2012E;
	text-decoration: none;
	text-indent: 2px;
}

.header_tdbg {
	background-image: url(../images/flirtas_header-1x2.gif);
	background-repeat: no-repeat;
	background-position: 0px 0px;
}
.logininput_header {
	font-family: Tahoma;
	font-size: 12px;
	font-weight: normal;
	color: #214091;
	text-decoration: none;
	background-color: #FEFEFE;
	border: 1px solid #666666;
	width: 95px;
}
.logintext_header {
	font-family: Tahoma;
	font-size: 10px;
	font-weight: normal;
	color: #333333;
	text-decoration: none;
	padding-left: 2px;
}
FORM.formular {
	BORDER-RIGHT: 0px; PADDING-RIGHT: 0px; BORDER-TOP: 0px; DISPLAY: inline; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; BORDER-LEFT: 0px; PADDING-TOP: 0px; BORDER-BOTTOM: 0px
}
.modultitle {
	font-family: Tahoma;
	font-size: 11px;
	font-weight: bolder;
	color: #8F9091;
	text-decoration: none;
}
.modul_td_left {
	background-image: url(../images/modul-4x1.gif);
	background-repeat: repeat;
}
.modul_td_right {
	background-image: url(../images/modul-3x3.gif);
	background-repeat: repeat;
}
.modul_td_bottom {
	background-image: url(../images/modul-6x2.gif);
	background-repeat: repeat;
}
.modultext_nooffer {
	text-align: center;
	font-family: Tahoma;
	font-size: 11px;
	font-weight: bold;
	color: #FFFFFF;
	text-decoration: none;
}
.modul_td_maskottchen_top {
	background-image: url(../images/modul_maskottchen-1x2.gif);
}
.modultext_maskottchen_nooffer {
	font-family: Tahoma;
	font-size: 11px;
	font-weight: bold;
	color: #FFFFFF;
	text-decoration: none;
	padding-left: 33px;
}
.modul_maskottchen_td_right {
	background-image: url(../images/modul_maskottchen-td_right.gif);
	background-repeat: repeat;
}
.modul_maskottchen_td_right2 {
	background-image: url(../images/modul_maskottchen-td_right2.gif);
	background-repeat: repeat;
}
.modultext_noofer_dark {
	font-family: Tahoma;
	font-size: 11px;
	font-weight: bold;
	color: #C2B18B;
	text-decoration: none;
	text-align: center;
}
.text_quicksuche {
	font-family: Tahoma;
	font-size: 10px;
	font-weight: bold;
	color: #8F9091;
	text-decoration: none;
	text-indent: 2px;
}
.copyright {
	font-family: Tahoma;
	font-size: 11px;
	font-weight: normal;
	color: #999999;
	text-decoration: none;
}
#copyright a {
	font-family: Tahoma;
	font-size: 11px;
	font-weight: normal;
	font-variant: normal;
	color: #CD4553;
	text-decoration: underline;
}
#copyright a:hover {
	font-family: Tahoma;
	font-size: 11px;
	font-weight: normal;
	font-variant: normal;
	color: #CD4553;
	text-decoration: none;
}


.quicksuche_input {
	font-family: Tahoma;
	font-size: 10px;
	font-weight: normal;
	text-decoration: none;
	background-color: #F6F6F6;
	border: 1px solid #CCCCCC;
	width: 85px;
}
.quicksuche_input2 {
	font-family: Tahoma;
	font-size: 10px;
	font-weight: normal;
	text-decoration: none;
	background-color: #F6F6F6;
	border: 1px solid #CCCCCC;
	padding-left: 400px;
	width: 32px;
}
.quicksuche_input_checkbox {
	font-weight: normal;
	text-decoration: none;
	background-color: #F6F6F6;
	border: 1px solid #CCCCCC;
	padding-left: 400px;
}
br {
	line-height: 4px;
}
h4 {
	font-family: Tahoma;
	font-size: 13px;
	font-weight: bold;
	color: #969696;
}
.tdheight1 {
	height: 3px;
	font-size: 5px;
	font-family: "Courier New", Courier, mono;
}
.td_starttop {
	background-attachment: fixed;
	background-image: url(../images/020513_1505_0124_lsms.jpg);
	background-repeat: no-repeat;
	background-position: left center;
}
.lovestorys_td_bg {
	background-image: url(../images/lovestorys-3x2.gif);
	background-repeat: no-repeat;
	font-family: Tahoma;
	font-size: 10px;
	font-weight: bold;
	text-decoration: none;
	color: #E48F9B;
}
.lovestorys_start_text {
	font-family: Tahoma;
	font-size: 11px;
	font-weight: normal;
	color: #666666;
	text-decoration: none;
	line-height: 12px;
}
.lovestorysbg1 {
	background-image: url(../images/lovestorysbg1.gif);
	background-repeat: repeat;
}
.lovestorysbg2 {
	background-image: url(../images/lovestorysbg2.gif);
	background-repeat: repeat;
}
.input_standard {
	font-family: Tahoma;
	font-size: 12px;
	font-weight: normal;
	color: #333333;
	text-decoration: none;
	background-color: #FFFFFF;
	border: 1px solid #999999;
	height: 20px;
}
.input_error {
	font-family: Tahoma;
	font-size: 12px;
	font-weight: normal;
	color: #ffffff;
	text-decoration: none;
	background-color: #C50032;
	border: 1px solid #999999;
	height: 20px;
}
.Stil2 {
	color: #999999;
	font-weight: bold;
}
.Stil3 {color: #FF0000}

.Stil1 {color: #C3002E}

Der relevante Style wäre hier .quicksuche_input bzw. quicksuche_input2

[mrhappiness]

Original geschrieben von devJunk
Hmm....stimmt....wenn ich die Stylesheet-Datei nicht angebe, werden die Felder angezeigt ... Was stimmt denn nicht an dem CSS ???

[CSS]

Der relevante Style wäre hier .quicksuche_input bzw. quicksuche_input2

Woher weißt du, dass das die "Übeltäter" sind?
Hast du die entsprechenden Einträg aus dem Sytlesheet entfernt und die Optionsfelder dann gesehen?

Prinzipielle Vorgehensweise:
- Stylesheet langsam so erweitern, wie die Felder angezeigt werden
- Bei einer ID oder Klasse, die dazu führt, dass die Felder nicht angezeigt werden, kannst du ja dementsprechend die einzelnen Einstellungen eine nach der anderen wieder rausnehmen


P.S.
Ich würde aufs padding tippen, schließlich schiebst du die Felder damit 400 Pixel nach rechts...