nicht angemeldet
Radio-Button & Textfelder addieren
MudGuardHallo alle,
also ich möchte durch zwei Textfelder haben, in die man Werte einträgt. Wenn ich nun zusätzlich ein Radio-Button betätige wird das Ergebnis mit einer bestimmte Summe addiert. Wenn ich auf den "OK-"Button klicke soll das ganze ausgegeben werden.
Soweit geht es, nur wenn ich den Radio-Button dem Quelltext hinzufüge passiert beim betätigen des Ausgabe-Buttons nichts mehr.
Ich hoffe das kam verständlich rüber.
Mein Quelltext sieht viel folgt aus:
Die Javascriptdatei:
function input() {
var es;
if (document.radios.r1.checked == true)
{
es = 100;
}
we=document.getElementById("we").value =
parseFloat(document.getElementById("lv").value)+
parseFloat(document.getElementById("ie").value);
}
Die HTML-Datei:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" type="text/css" href="layout.css">
<script src="expcalculator.js" type="text/javascript"></script>
</head>
<body>
<form name=all>
<div style="position:absolute; top: 20px; left:290px;">
<input type="button" value="Calculate" onclick="input();" style="width: 100px; height:40px; font-weight:bold;">
<input type="reset" value="Reset all">
</div>
<div style="position:absolute; top: 180px;">
<input type="text" id="lv" size="4" maxlength="2" value="0">
<input type="text" id="ie" size="4" maxlength="3" value="0">
</div>
<form name=radios>
<input type="radio" name="r1" id="r1">
</form>
<div style="position:absolute; top: 200px; left:1px;">
Ausgabe:<input type="text" id="we" size="4" maxlength="3" value="0">
</div>
</form>
</body>
</html>
Ich hoffe mir kann geholfen werden, danke. :)
-
Guten Morgen,
also ich möchte durch zwei Textfelder haben, in die man Werte einträgt. Wenn ich nun zusätzlich ein Radio-Button betätige wird das Ergebnis mit einer bestimmte Summe addiert.
dies ist aus dem angeführten Quelltext nicht ersichtlich.
Wenn ich auf den "OK-"Button klicke soll das ganze ausgegeben werden.
Auch ein Butten "OK" ist schlichtweg nicht vorhanden.
Soweit geht es, nur wenn ich den Radio-Button dem Quelltext hinzufüge passiert beim betätigen des Ausgabe-Buttons nichts mehr.
if (document.radios.r1.checked == true)
Vermutlich liegt es daran, dass das Objekt
document.radiosnicht existiert.we=document.getElementById("we").value =
Hier greifst Du doch auch auf ein HTML-Element mittels Methode getElementById() zu. Warum machst Du das oben nicht auch? Dein Radio-Eingabefeld hat doch eine ID. ;)
Gruß aus Berlin!
eddi--
“Um etwas zu erschaffen mit gutem Erfolg, muß man aufhören das zu sein, was man ist; um ganz das zu werden, was man hervorbringen will.”-
Danke an alle.
Habe es nun hinbekommen:function input() {
var es;
(document.getElementsByName("cb1").checked = true)
{
es = 100;
}we=document.getElementById("we").value =
parseFloat(document.getElementById("lv").value)+
parseFloat(document.getElementById("ie").value)+es;}
--------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><link rel="stylesheet" type="text/css" href="layout.css" />
<script src="expcalculator.js" type="text/javascript"></script>
</head>
<body><form name="allcbs">
<div style="position:absolute; top:20px; left:290px;">
<input type="button" value="OK" onclick="input();" style="width: 100px; height:40px; font-weight:bold;">
<input type="reset" value="Reset all">
</div><div style="position:absolute; top: 180px;">
<table cellpadding="2">
<tr>
<td width="190" bgcolor="#616d7e">Property
<td width="50" bgcolor="#616d7e">Sum</td></tr>
</table><table border="1">
<tr>
<td width="190">
Textbox1:
<td>
<input type="text" id="lv" size="4" maxlength="2" value="0">
</td>
</tr><tr>
<td>
Textbox2:
<td>
<input type="text" id="ie" size="4" maxlength="3" value="0">
</td>
</tr><tr>
<td>Textbox3:
<td>
<input type="checkbox" name="cb1">
</td>
</tr>
</table><div style="position:absolute; top: 200px; left:1px;"><b>
Ausgabe: <input type="text" id="we" size="4" maxlength="3" value="0">
</div></form>
</div>
</body>
</html>Noch eine Frage: Was ist der Unterschied zwischen Radio-Buttons und Checkboxen?
Danke noch mal. :)
-
Hallo,
Noch eine Frage: Was ist der Unterschied zwischen Radio-Buttons und Checkboxen?
das zu wissen_bevor_man etwas verwendet, könnte natürlich u.U. von Vorteil sein. ;-)
Siehe: <http://de.selfhtml.org/html/formulare/auswahl.htm@title=Auswahllisten, Radio-Buttons und Checkboxen>
Gruß Gunther
-
function input() {
var es;
(document.getElementsByName("cb1").checked = true)
{
es = 100;
}we=document.getElementById("we").value =
parseFloat(document.getElementById("lv").value)+
parseFloat(document.getElementById("ie").value)+es;}
<form name="allcbs">
<div style="position:absolute; top:20px; left:290px;">
<input type="button" value="OK" onclick="input();" style="width: 100px; height:40px; font-weight:bold;">
<input type="reset" value="Reset all">
</div><div style="position:absolute; top: 180px;">
<table cellpadding="2">
<tr>
<td width="190" bgcolor="#616d7e">Property
<td width="50" bgcolor="#616d7e">Sum</td></tr>
</table><table border="1">
<tr>
<td width="190">
Textbox1:
<td>
<input type="text" id="lv" size="4" maxlength="2" value="0">
</td>
</tr><tr>
<td>
Textbox2:
<td>
<input type="text" id="ie" size="4" maxlength="3" value="0">
</td>
</tr><tr>
<td>Textbox3:
<td>
<input type="checkbox" name="cb1">
</td>
</tr>
</table>Es ist doch noch ein mir unersichtlicher Fehler in dem Quelltext.
Also es wird zwar die Variable aus der Checkbox addiert, jedoch leider auch wenn sie nicht angekreuzt ist.Wieso nicht? Ich habe doch "checked = true" angegeben?!
-
Mahlzeit hans85,
Habe es nun hinbekommen:
Nein, hast Du nicht - ich spiele mal JS-Parser:
function input() {
Aha, es handelt sich wohl um eine http://de.selfhtml.org/javascript/sprache/funktionen.htm#definieren@title=Funktionsdeklaration.
var es;
Aha, die Variable namens "es" <http://de.selfhtml.org/javascript/sprache/variablen.htm#definieren@title=wird deklariert>.
(document.getElementsByName("cb1").checked = true)
Hm, ich soll also der <http://de.selfhtml.org/javascript/objekte/document.htm#get_elements_by_name@title=Auflistung aller Elemente mit dem Namen "cb1"> die Eigenschaft "checked" auf TRUE http://de.selfhtml.org/javascript/sprache/operatoren.htm#zuweisung@title=setzen.
{
es = 100;
}Tja, ein mitten irgendwo im Code hängender http://de.selfhtml.org/http://de.selfhtml.org/javascript/sprache/regeln.htm#anweisungsbloecke@title=Anweisungsblock? Komisch ...
we=document.getElementById("we").value =
parseFloat(document.getElementById("lv").value)+
parseFloat(document.getElementById("ie").value)+es;Aha, ich soll also der globalen Variable namens "we" den Wert der Zuweisung der addierten Werte der <http://de.selfhtml.org/javascript/objekte/document.htm#get_element_by_id@title=Elemente mit den IDs "lv" bzw. "ie"> sowie der Variablen namens "es" an des Element mit der ID "we" zuweisen. Hä?
Noch eine Frage: Was ist der Unterschied zwischen Radio-Buttons und Checkboxen?
[...]
Danke noch mal. :)Ich halte es für extrem sinnvoll, wenn Du erstmal die <http://de.selfhtml.org/javascript/intro.htm@title=Grundlagen der von Dir verwendeten Technologie(n)> lernst.
MfG,
EKKi--
sh:( fo:| ch:? rl:( br:> n4:~ ie:% mo:} va:) de:] zu:) fl:{ ss:) ls:& js:|
-
-
-
Mahlzeit hans85,
abgesehen von Edgars Hinweise:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Du nutzt offenbar XHTML.
<link rel="stylesheet" type="text/css" href="layout.css">
Dann solltest Du dieses Element auch schließen ...
<form name=all>
... und Attributwerte in Anführungszeichen einschließen.
Validiere Deinen Code! Ein Haus ohne stabiles Fundament *KANN* nicht zuverlässig stehen ...
<form name=radios>
<input type="radio" name="r1" id="r1">
</form>1. dürfen <form>-Elemente nicht verschachtelt werden und
2. sollten Formularelemente, die gemeinsam behandelt werden sollen, schon in dem gleichen Formular stehen.
MfG,
EKKi--
sh:( fo:| ch:? rl:( br:> n4:~ ie:% mo:} va:) de:] zu:) fl:{ ss:) ls:& js:|-
Hi,
<form name=radios>
<input type="radio" name="r1" id="r1">
</form>- dürfen <form>-Elemente nicht verschachtelt werden und
- sollten Formularelemente, die gemeinsam behandelt werden sollen, schon in dem gleichen Formular stehen.
3. ist ein einzelner Radiobutton auch nicht wirklich sinnvoll
cu,
Andreas--
Warum nennt sich Andreas hier MudGuard?
O o ostern ...
Fachfragen per Mail sind frech, werden ignoriert. Das Forum existiert.
-
Hallo,
- dürfen <form>-Elemente nicht verschachtelt werden und
- sollten Formularelemente, die gemeinsam behandelt werden sollen, schon in dem gleichen Formular stehen.
- ist ein einzelner Radiobutton auch nicht wirklich sinnvoll
weil es 4. eine Checkbox( <input type="checkbox"> ) gibt ...
MfG. Christoph Ludwig
--
Wo die Sprache aufhört, fängt die Musik an...
Selfcode: sh:( fo:| ch:} rl:( br:> n4:? ie:{ mo:) va:} js:| de:> zu:) fl:( ss:) ls:&
Go to this
-