Text und Checkbox Wert in Tabelle ausgeben
Joern
- javascript
0 hackerboy19930 Beat
Hallo Zusammen,
ich bräuchte etwas Hilfe bei einem kleinen Script, ich komme einfach nicht weiter.
Das Ziel:
Ich möchte den Wert eine Form in eine Tabelle ausgeben.
Mit dem Textfeld funktioniert das auch wunderbar nur die Checkbox wird einfach nicht ausgegeben.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>test</title>
<script type="text/javascript">
function ausgeben(){
return document.form.text.value;
return document.form.checkbox1.value;
}
</script>
</head>
<body>
<form name="form" action="#">
<input name="text" value="Hier Wert eingeben">
<p>
<input type="checkbox" name="checkbox1" value="checkwert"> Checkwert<br>
</p>
<p>
<input type="button" value="click" onclick="document.getElementById('werte').innerHTML = ausgeben();">
</p>
</form>
<table border="1">
<tr>
<td id="werte">Nix</td>
</tr>
</table>
</body>
</html>
Danke für eure Hilfe,
Joern
Hallo.
Von mir aus gesehen ist das nur ein Schreibfehler. Es sollte so heissten:
function ausgeben(){
return document.form.text.value;
return document.form.checkbox.value;
}
Und nicht ....form.checkbox1.value.
MFG Hackerboy
Von mir aus gesehen ist das nur ein Schreibfehler. Es sollte so heissten:
Oops. Und das war auch ein Schreibfehler. *heissen :-)
Mfg
Das Ziel:
Ich möchte den Wert eine Form in eine Tabelle ausgeben.
Mit dem Textfeld funktioniert das auch wunderbar nur die Checkbox wird einfach nicht ausgegeben.[code lang=javascript]
function ausgeben(){
return document.form.text.value;
return document.form.checkbox1.value;
zweimal return?
Die Checkbox wird gar nicht mehr ausgegeben.
Konateniere zuerst, Dann gebe daen resultierenden String zurück.
mfg Beat
zweimal return?
Die Checkbox wird gar nicht mehr ausgegeben.
Konateniere zuerst, Dann gebe daen resultierenden String zurück.mfg Beat
Hallo Beat,
danke für den Tipp, kannst du mir ein Beispiel geben?
Danke,
Joern
danke für den Tipp, kannst du mir ein Beispiel geben?
Streng geheim
var1 = 'a'
var2 = 'b'
return( var1 + var2 )
was kommt raus?
mfg Beat
danke für den Tipp, kannst du mir ein Beispiel geben?
Streng geheim
var1 = 'a'
var2 = 'b'
return( var1 + var2 )was kommt raus?
mfg Beat
a + b :)
Nicht falsch verstehen, soweit bin ich bis jetzt ohne dein letzes Posting gekommen:
function ausgeben(){
return document.form.text.value + "<br>" +
document.form.checkbox1.value;
}
Nur jetzt gibt er mir den Wert der Checkbox immer aus, er soll den Wert nur ausgeben wenn die Checkbox angehakt ist.
Also muss ich noch ein IF document.form.checkbox1.checked == true einbauen.
Nur wie mach ich das nun wieder, oh man mein Schedel brutzelt schon richtig.
a + b :)
Nicht falsch verstehen, soweit bin ich bis jetzt ohne dein letzes Posting gekommen:
function ausgeben(){
return document.form.text.value + "<br>" +
document.form.checkbox1.value;
}Nur jetzt gibt er mir den Wert der Checkbox immer aus, er soll den Wert nur ausgeben wenn die Checkbox angehakt ist.
Also muss ich noch ein IF document.form.checkbox1.checked == true einbauen.
Nur wie mach ich das nun wieder, oh man mein Schedel brutzelt schon richtig.
Mein Kopf brutzelt schon so das ich Schädel mit "e" schreibe...
So klappt das auch nicht...aarrrggg:
var1 = "document.form.text.value"
var2 = "document.form.checkbox1.value == true"
function ausgeben(){
return var1 + "<br>" + var2;
}
Mein Kopf brutzelt schon so das ich Schädel mit "e" schreibe...
So klappt das auch nicht...aarrrggg:
var1 = "document.form.text.value"
Du weist hier nicht das ergebnis einer Objektmethode zu, sondern einen Stringliteral.
var2 = "document.form.checkbox1.value == true"
Wolltest du nicht das Attribut checked testen?
function ausgeben(){
return var1 + "<br>" + var2;
}
Brutzel weiter.
function myfunc(){
var temp = object1.property1;
if( object2.property2 == true ){
temp += ' ' + object2.property1;
}
return temp;
}
mfg Beat
Beat du bist der Best :), jetzt klappts!!!
DANKE und viel Erfolg mit deinem Projekt X-Torah!
anbei nochmal der Quelltext der gesamten Seite:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>test</title>
<script type="text/javascript">
function ausgeben(){
var temp = document.form.text.value;
if( document.form.checkbox1.checked == true ){
temp += ' ' + "<br>" + document.form.checkbox1.value;
}
return temp;
}
</script>
</head>
<body>
<form name="form" action="#">
<input name="text" value="Hier Wert eingeben">
<p>
<input type="checkbox" name="checkbox1" value="checkwert"> Checkwert<br>
</p>
<p>
<input type="button" value="click" onclick="document.getElementById('werte').innerHTML = ausgeben();">
</p>
</form>
<table border="1">
<tr>
<td id="werte">Nix</td>
</tr>
</table>
</body>
</html>
Oh man, zu früh gefreut.
Ich habs immer noch nicht verstanden :(
Sobald ich z.B. die Text-Eingabe entferne, funktioniert wieder nichts.
function ausgeben(){
var temp = if( document.form.checkbox1.checked == true ){
document.form.checkbox1.value;}
return temp;
}
Syntax fehler?!?
Ich möchte natürlich mehrer Checkboxen abfragen.
Oh man, zu früh gefreut.
Ich habs immer noch nicht verstanden :(
Sobald ich z.B. die Text-Eingabe entferne, funktioniert wieder nichts.
Schlechte Beschreibung. Das ist ein Hinweis, dass du kein value Attribut im inputfeld hast.
if x = true ... was ist, wenn du in dein inputfeld eine 0 schreibst?
Gehen wir halte alle einzelnen Prüfungen durch:
function myfunc(){
var temp = ''; // vorinitialisieren
if(...){...}
}
mfg Beat
Ok, mit einer Checkbox ohne Eingabefeld klappts nun, nur jetzt gibt er mir nur Werte wenn beide Checkboxen gesetzt sind???
Muss ich eine zweite var anlegen?
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>test</title>
<script type="text/javascript">
function ausgeben(){
var temp = ''
if( document.form.checkbox1.checked == true)
if( document.form.checkbox2.checked == true)
{temp += '' + document.form.checkbox1.value + "<br>" + document.form.checkbox2.value;}
return temp;
}
</script>
</head>
<body>
<form name="form" action="#">
<p>
<input type="checkbox" name="checkbox1" value="checkwert1"> Checkwert<br>
</p>
<input type="checkbox" name="checkbox2" value="checkwert2"> Checkwert2<br>
<p>
<input type="button" value="click" onclick="document.getElementById('werte').innerHTML = ausgeben();">
</p>
</form>
<table border="1">
<tr>
<td id="werte">Nix</td>
</tr>
</table>
<p> </p>
<p>function myfunc(){<br>
var temp = ''; // vorinitialisieren<br>
if(...){...}<br>
}</p>
</body>
</html>
Ich bin ganz nah dran...
function ausgeben(){
var temp = ''
if( document.form.checkbox1.checked == true)
{temp += '' + document.form.checkbox1.value}
var temp1 = ''
if( document.form.checkbox2.checked == true)
{temp += '' + document.form.checkbox2.value}
return temp+temp1;
}
Mir fehlt bei der Ausgabe nur noch ein <br> Tag.
Das Ergebnis sollte so aussehen:
checkwert1
checkwert2
Ich habs...
Danke für deine Gedult!
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>test</title>
<script type="text/javascript">
function ausgeben(){
var temp = ''
if( document.form.checkbox1.checked == true)
{temp += '' + document.form.checkbox1.value + "<br>"}
var temp1 = ''
if( document.form.checkbox2.checked == true)
{temp += '' + document.form.checkbox2.value + "<br>"}
var temp2 = ''
if( document.form.checkbox3.checked == true)
{temp += '' + document.form.checkbox3.value + "<br>"}
return temp+temp1+temp2;
}
</script>
</head>
<body>
<form name="form" action="#">
<p>
<input type="checkbox" name="checkbox1" value="checkwert1"> Checkwert<br>
</p>
<input type="checkbox" name="checkbox2" value="checkwert2"> Checkwert2<br>
</p>
<input type="checkbox" name="checkbox3" value="checkwert3"> Checkwert3<br>
<p>
<input type="button" value="click" onclick="document.getElementById('werte').innerHTML = ausgeben();">
</p>
</form>
<table border="1">
<tr>
<td id="werte">Nix</td>
</tr>
</table>
<p> </p>
<p>function myfunc(){<br>
var temp = ''; // vorinitialisieren<br>
if(...){...}<br>
}</p>
</body>
</html>
Mahlzeit Joern,
Ich habs...
Nein, Du hast es nicht.
function ausgeben(){
var temp = ''
Tu Dir selbst einen Gefallen und schließe ALLE Javascript-Befehle mit einem Semikolon ab - das erhöht die Übersichtlichkeit und vereinfacht die Fehlersuche.
if( document.form.checkbox1.checked == true)
Du prüfst, ob etwas, das wahr ist, wahr ist. Das ist komplizierter als nötig - einfacher verständlich wäre folgendes:
if (document.form.checkbox1.checked) { }
{temp += '' + document.form.checkbox1.value + "<br>"}
var temp1 = ''
if( document.form.checkbox2.checked == true)
{temp += '' + document.form.checkbox2.value + "<br>"}
Wozu initialisierst Du eine Variable namens temp1, wenn Du sie doch gar nicht benutzt?
var temp2 = ''
if( document.form.checkbox3.checked == true)
{temp += '' + document.form.checkbox3.value + "<br>"}
Wozu initialisierst Du eine Variable namens temp2, wenn Du sie doch gar nicht benutzt?
return temp+temp1+temp2;
Achso, hier benutzt Du die beiden. Allerdings steht in ihnen nur das drin, was Du ihnen als Wert zugewiesen hast - nämlich ein leerer String. Also sind sie komplett überflüssig.
MfG,
EKKi
So jetzt bin ich völlig verwirrt?!?
function ausgeben(){
var temp = ''
ok, wird gemacht
if (document.form.checkbox1.checked) {
auch noch verständlich.
{temp += '' + document.form.checkbox1.value + "<br>"}
var temp1 = ''
if( document.form.checkbox2.checked == true)
{temp += '' + document.form.checkbox2.value + "<br>"}
Ich dachte
temp1 = '' wird gesetzt wenn checkbox ist nicht gecheckt dann übergebe nichts.
temp ist der Wert der ersten Checkbox
temp1 ist der Wert der zweiten Checkbox
u.s.w.
return temp+temp1+temp2;
Das soll ja auch so sein.
Wenn nicht gecheckt dann übergebe nichts, aber wenn gecheckt nimm den Value von Checkbox.
So klappt leider nix?!?
function ausgeben(){
if( document.form.checkbox1.checked)
{document.form.checkbox1.value + "<br>"};
if( document.form.checkbox2.checked)
{document.form.checkbox2.value + "<br>"};
if( document.form.checkbox3.checked)
{document.form.checkbox3.value + "<br>"};
return;
}
hallo,
So jetzt bin ich völlig verwirrt?!?
vielleicht wird klarer was gemeint ist wenn man die variablen in deinem geposteten code etwas umschreibt:
function ausgeben(){
var apfel = '';
if( document.form.checkbox1.checked == true)
{apfel += '' + document.form.checkbox1.value + "<br>"};
var birne = '';
if( document.form.checkbox2.checked == true)
{apfel += '' + document.form.checkbox2.value + "<br>"};
var banane = '';
if( document.form.checkbox3.checked == true)
{apfel += '' + document.form.checkbox3.value + "<br>"};
return apfel+birne+banane;
}
oder - damit wirds vielleicht noch klarer - so:
function ausgeben(){
var apfel = '';
var birne = '';
var banane = '';
if( document.form.checkbox1.checked == true)
{apfel += '' + document.form.checkbox1.value + "<br>"};
if( document.form.checkbox2.checked == true)
{apfel += '' + document.form.checkbox2.value + "<br>"};
if( document.form.checkbox3.checked == true)
{apfel += '' + document.form.checkbox3.value + "<br>"};
return apfel+birne+banane;
}
besser jetzt?
pD
if( document.form.checkbox1.checked == true)
{apfel += '' + document.form.checkbox1.value + "<br>"};
Wobei der Leerstring, vor dem Formularfeldwert unnötig ist.
{apfel += document.form.checkbox1.value + "<br>"};
Struppi.
if( document.form.checkbox1.checked == true)
{apfel += '' + document.form.checkbox1.value + "<br>"};Wobei der Leerstring, vor dem Formularfeldwert unnötig ist.
{apfel += document.form.checkbox1.value + "<br>"};
Struppi.
Ich möchte mich bei euch für eure Unterstützung bedanken!
Besonders gut finde ich das nicht platt die Lösung gepostet wird, so muss man selbst seinen Hirnschmalz ins rotieren bringen.
Nur so, glaube ich wird man die Sprache letztendlich verstehen.
Mithilfe eurer Tipps, einem Buch (hab ich mir extra zugelegt) und einem guten Freund hab ich es nun hinbekommen.
Für alle die es interesiert, so sieht nun mein Script (noch etwas erweitert) aus:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>test</title>
<script type="text/javascript">
function ausgeben(){
temp0 = parseInt(0)
if (document.form.checkbox1.checked)
{temp0 = parseInt(document.form.checkbox1.value)}
temp0txt = ''
if (document.form.checkbox1.checked)
{temp0txt = document.form.checkbox1.id + " " + temp0 }
temp1 = parseInt(0)
if (document.form.checkbox2.checked)
{temp1 = parseInt(document.form.checkbox2.value)}
temp1txt = ''
if (document.form.checkbox2.checked)
{temp1txt = document.form.checkbox2.id + " " + temp1 }
temp2 = parseInt(0)
if (document.form.checkbox3.checked)
{temp2 = parseInt(document.form.checkbox3.value)}
temp2txt = ''
if (document.form.checkbox3.checked)
{temp2txt = document.form.checkbox3.id + " " + temp2 }
tempall = temp0+temp1+temp2
document.getElementById('summe').innerHTML = tempall;
temptext = temp0txt + "<br>" + temp1txt + "<br>" + temp2txt
document.getElementById('htmltext').innerHTML = temptext
return
}
</script>
</head>
<body>
<form name="form">
<p>
<input type="checkbox" name="checkbox1" value="120" id="checkwert1"> Checkwert 120€<br>
</p>
<input type="checkbox" name="checkbox2" value="150" id="checkwert2"> Checkwert2 150€<br>
</p>
<input type="checkbox" name="checkbox3" value="180" id="checkwert3"> Checkwert3 180€<br>
<p>
<input type="button" value="click" onclick="ausgeben();">
</p>
</form>
<table width="250" border="1" cellspacing="0" cellpadding="5">
<tr>
<td valign="top" width="60">Artikel:</td>
<td id="htmltext"></td>
</tr>
<tr>
<td valign="top">Summe:</td>
<td id="summe"></td>
</tr>
</table>
</body>
</html>
Mahlzeit Joern,
Besonders gut finde ich das nicht platt die Lösung gepostet wird, so muss man selbst seinen Hirnschmalz ins rotieren bringen.
Nur so, glaube ich wird man die Sprache letztendlich verstehen.
Genau so sehen das die meisten Teilnehmer dieses Forums auch - wobei sie damit bei ungeduldigen Zeitgenossen auch gern mal anecken ...
Mithilfe eurer Tipps, einem Buch (hab ich mir extra zugelegt) und einem guten Freund hab ich es nun hinbekommen.
Ich würde Dir trotzdem erneut, wiederholt und immer wieder raten, jeden Javascript-Befehl mit einem Semikolon abzuschließen. Dein "fertiger" Code liest sich sehr unschön, insbesondere weil nicht sofort klar ersichtlich ist, wo die einzelnen Befehle/Funktionsaufrufe enden.
Darüber hinaus behaupte ich, dass der Code noch viel stärker vereinfacht werden kann - dafür solltest Du allerdings noch einmal in Dich gehen und Dir selbst (und ggf. uns auch) in einfachen Worten, aber normaler Umgangssprache, d.h. vollkommen ohne Programmcode, beschreiben, WAS GENAU Du eigentlich anzeigen willst bzw. wann und bei welchem Zustand welcher Inhalt von was wie dargestellt werden soll. Vielleicht bin ich ja auch doof - aber irgendwie ist mir das immer noch nicht klar ... und Dein Code ändert da auch nichts dran, weil er nicht wirklich übersichtlich und verständlich ist.
MfG,
EKKi
Mahlzeit Joern,
So jetzt bin ich völlig verwirrt?!?
Das macht nichts, da kann man ja was gegen tun. pother_dane hat ja schon versucht, Licht ins Dunkel zu bringen.
{temp += '' + document.form.checkbox1.value + "<br>"}
var temp1 = ''
if( document.form.checkbox2.checked == true)
{temp += '' + document.form.checkbox2.value + "<br>"}Ich dachte
temp1 = '' wird gesetzt wenn checkbox ist nicht gecheckt dann übergebe nichts.
Dieser Satz kein Sinn.
In Deinem Code steht sinngemäß folgendes:
Setze Variable temp auf einen leeren String.
Wenn die erste Checkbox angekreuzt ist, hänge an die Variable temp den Wert der ersten Checkbox an.
Setze Variable temp1 auf einen leeren String.
Wenn die zweite Checkbox angekreuzt ist, hänge an die Variable temp den Wert der zweiten Checkbox an.
Setze Variable temp2 auf einen leeren String.
Wenn die dritte Checkbox angekreuzt ist, hänge an die Variable temp den Wert der dritten Checkbox an.
Wozu die Variablen temp1 und temp2?
Vielleicht solltest Du - für Dich - einfach mal genau und detailliert aufschreiben, was Du eigentlich willst ... und zwar vollkommen OHNE Programmcode. Welche Aktion soll was bewirken, welches Element ist abhängig von was usw.
temp ist der Wert der ersten Checkbox
Ja (mehr oder wenig).
temp1 ist der Wert der zweiten Checkbox
Nein. Wie kommst Du darauf?
return temp+temp1+temp2;
Das soll ja auch so sein.
Sicher? Ich glaube nicht. Was willst Du eigentlich ausgeben?
Wenn nicht gecheckt dann übergebe nichts, aber wenn gecheckt nimm den Value von Checkbox.
Welchen Wert welcher Checkbox? Der angekreuzten? Oder jeder anderen auch? Irgendwie ist mir immer noch nicht ganz klar, was Du eigentlich willst. Versuche es zu erläutern, ohne irgendeine Form von Programmcode zu verwenden (der aus Deiner Feder z.Z. leider zu häufig fehlerhaft ist) ...
So klappt leider nix?!?
Natürlich nicht. Vielleicht solltest Du Dich (nochmals) mit den <http://de.selfhtml.org/javascript/intro.htm@title=Grundlagen von Javascript>, insbesondere mit der <http://de.selfhtml.org/javascript/sprache/variablen.htm@title=Zuweisung von Werten an Variablen> und der Verwendung von http://de.selfhtml.org/javascript/sprache/bedingt.htm@title=Kontrollstrukturen beschäftigen.
if( document.form.checkbox1.checked)
{document.form.checkbox1.value + "<br>"};
Du konkatinierst hier den Wert der ersten Checkbox und einen String, speicherst das Ergebnis aber nirgendwo ab bzw. gibst es aus - welchen Sinn soll das haben?
Nochmals mein Tipp: versuch erstmal, Dir in allgemein üblicher Sprache und vollkommen ohne Programmcode klar darüber zu werden, was Du eigentlich machen willst. Danach schreibst Du das strukturiert auf (nennt sich Struktogramm und sollte insbesonders bei Anfängern in Programmierung absolute PFLICHT sein!) - danach kannst Du Dich dann an die Programmierung machen ... aber wenn Du eigentlich überhaupt gar nicht genau weißt, was Du willst und was Du tust, ist fast jeglicher Versuch zum Scheitern verurteilt.
MfG,
EKKi
Hallo,
versuch erstmal, Dir in allgemein üblicher Sprache und vollkommen ohne Programmcode klar darüber zu werden, was Du eigentlich machen willst. Danach schreibst Du das strukturiert auf (nennt sich Struktogramm und sollte insbesonders bei Anfängern in Programmierung absolute PFLICHT sein!)
das kann ich nur unterstreichen - obwohl ich die von dir verlinkte Art der Struktogramme (Nassi-Shneidermann) für recht unübersichtlich und nicht gerade für Anfänger geeignet halte.
Das liegt aber vielleicht daran, dass ich in meinem Informatikstudium diese Art der Darstellung nur kurz gestreift habe; bei uns wurden bevorzugt klassische Flowcharts (aka Programmablaufplan, PAP) verwendet. Die finde ich wesentlich anschaulicher und übersichtlicher - vielleicht auch deshalb, weil es auf dem Papier nicht so gedrängt aussieht.
Unabhängig von der Art der Darstellung kann ich aber nur bestätigen, dass es *unbedingt empfehlenswert* ist, sich auf die eine oder andere Art den gewünschten Programmablauf (einschließlich Daten- und Kontrollfluss) zu visualisieren, bevor man ans eigentliche Codieren geht. Man sollte sich das echt zur Gewohnheit machen, auch wenn man ein einfaches Hello-World-Beispiel sicher mal schnell ohne Plan hinschreiben kann.
So long,
Martin
function ausgeben(){
var temp = if( document.form.checkbox1.checked == true ){
document.form.checkbox1.value;}return temp;
}Syntax fehler?!?
Ja, du solltest ab und zu mal einen Blick in selfhtml werfen: http://de.selfhtml.org/javascript/sprache/bedingt.htm
Struppi.