Hilfe! Bekomme Variable nicht in Formular input

R

redpaprika

Grünschnabel
Hallo Javascript Experten da draussen!

Ich habe folgendes Problem: In Dropdownmenüs sollen Größe und Farbe eines Produktes ausgewählt werden können (das geht soweit).

Dann sollen diese beiden Angaben über die Variablen "Groesse" und "Farbe" in einem zweiten Formular als Produktbescheibung an die folgende Seite geschickt werden. Und genau da komme ich nicht mehr weiter. Aus irgendeinem Grund werden die beiden genannten Variablen nicht geändert. Bitte schaut mal drüber, wo der Fehler liegt! Ich komme nicht mehr weiter...

<html>
<head>
<script language="JavaScript" type="text/JavaScript">
var Groesse;
var Farbe;
function sendForm(){
document.form1.submit();
}

function replaceSpan(lvl)
{
Groesse = lvl;
if ( lvl == 'Gr00') {
newText = document.createTextNode("Kein Handy ausgewählt...");
} else if ( lvl == 'Gr01' ) {
newText = document.createTextNode("2cm x 7cm x 4cm");
} else if ( lvl == 'Gr02' ) {
newText = document.createTextNode("3cm x 8cm x 5cm");
}
var newSpan = document.createElement("span");
newSpan.setAttribute("id","ex3Span");
newSpan.appendChild(newText);

var para = document.getElementById("example3");
var spanElm = document.getElementById("ex3Span");
var replaced = para.replaceChild(newSpan,spanElm);
}

function bcolor(bcol,d_name1,d_name2)
{
Farbe = 'bcol';

if (bcol == 'rot') {
var col1 = '#cc0000';
var col2 = '#ff0000';
}
else if (bcol == 'schwarz') {
var col1 = '#000000';
var col2 = '#606060';
}
else if (bcol == 'gruen') {
var col1 = '#336633';
var col2 = '#339933';
}
else{
var col1 = '#d9d9d9';
var col2 = '#d9d9d9';
}
if (document.all)
{
var thestyle= eval ('document.all.'+d_name1+'.style');
thestyle.backgroundColor=col1;
var thestyle= eval ('document.all.'+d_name2+'.style');
thestyle.backgroundColor=col2;
}
}
</script>
</head>
<body>
<form>
<table width="600" border="1" cellpadding="5" cellspacing="0" class="text">
<tr>
<td width="10%" align="right" valign="top" class="blau">Abmessungen: </td>
<td width="50%" colspan="3" valign="top" id="example3">
<select name="Groesse" onChange="replaceSpan(this.options[this.selectedIndex].value)">
<option value="Gr00" selected>bitte wählen</option>
<option value="Gr01">Klein</option>
<option value="Gr02">Gross</option>
</select> <br> <span id="ex3Span">&nbsp;</span> </td>
</tr>
<tr>
<td align="right" valign="top" class="blau">Farbe:</td>
<td valign="top">
<select name="Farbe" onChange="bcolor(this.options[this.selectedIndex].value,'farbe1','farbe2')">
<option value="0" selected>bitte wählen</option>
<option value="schwarz">schwarz</option>
<option value="rot">rot</option>
<option value="gruen">grün</option>
</select></td>
<td width="10%" valign="top" bgcolor="#d9d9d9" id="farbe1">&nbsp;</td>
<td width="5%" valign="top" bgcolor="#d9d9d9" id="farbe2">&nbsp;</td>
</tr>
<tr>
<td colspan="4" align="right" valign="top" class="blau">
<div onclick="sendForm()" style="cursor: hand">
<font color="#CC0000" onMouseOver="this.className='unterstrichen';" onMouseOut="this.className='ohneDeko';">
Jetzt bestellen</font><span class="blau">&raquo;</span>
</div>
</td>
</tr>
</table>
</form>
<form name="form1" method="get" action="bestell1.htm">
<script type="text/javascript">
document.write('<input name="Produkt1" type="hidden" value="Filztasche für Handy '+(Groesse)+' '+(Farbe)+'">');
</script>
<input name="Preis1" type="hidden" value="25">
<input name="Anzahl1" type="hidden" value="1">
</form>
</body>
</html>
 
Das "write()" wird bereits beim Laden der Seite ausgeführt... später Benutzeraktionen werden da nicht berücksichtigt.
Packe das <input name="Produkt1"> normal in die Seite, und ändere bei der Auswahl von Farbe/Grösse seinen value
Ich frag mich allerdings, warum du nicht das erste Formular sendest... die Werte für Grösse/Farbe werden dort auch übermittelt.... deine Variante schliesst von vornherein User mit deaktiviertem JS aus(was kaum sinnvoll ist, wenn man etwas verkaufen will ;))
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück