[Erledigt] Checkbox mit onClick

daniel_1998 · 04.12.2011, 19:11

Hi,

ich versuche mit JS ein div ein und später dann wieder auszublenden, wenn gewisse Bedingungen erfüllt sind.

Aktuell habe ich das zusammengebaut:

JS

Code:

var zahlart = false;

function check(zahlart)
{
	alert(zahlart);
   if(document.getElementById(paypal))
   {    
       var ele = document.getElementById(zahlart);    
       if(ele.style.visibility=="hidden")
	   {    
           ele.style.visibility="visible";      
       }
	   else
	   { 
           ele.style.visibility="hidden";      
       }
   }
}

PHP

PHP-Code:

  echo '<td width="50%"><input type="radio" name="zahlart" '.(($daten->dtype == key($zahlart[$i])) ? 'checked="checked" ' : '').' value="'.key($zahlart[$i]).'" onClick="check('.key($zahlart[$i]).')">'.current($zahlart[$i]).'</td>';

<div id="aufpreis" style="visibility:hidden;">
    <span>Der Aufpreis beträgt bei dieser Zahlungsoption: xxx Euro </span>
</div>

Der PHP Code ist in einer Schleife. Dieser sieht dann wie folgt aus:

Code:

<input type="radio" onclick="check(paypal)" value="paypal" name="zahlart">

Wenn ich nun Paypal anklicke sollte meines Verständniss nach die JS-function "check" aufgerufen werden. Zur debugging habe ich dort auch schon ein alert eingebaut. Bekomme dies aber nicht raus.
Firebug zeig mir nur den Fehler an, das paypal nicht definiert ist.
Aber ich glaube, dass das nur eine Warnung ist, die das alert fenster zumindest nicht unterdrücken sollte.
Da ich leider nicht mehr an Fehler zurückbekomme, muß ich hier mal die erfahrender Fraktion fragen, woran es liegen könnte.

Habt Dank

nikosch · 04.12.2011, 19:52

Zitat:

onclick="check(paypal)"

Woher soll paypal hier kommen? Javascript funktioniert nicht wie Formular-Submit. Lerne Grundlagen | Quellensammlung

daniel_1998 · 04.12.2011, 20:21

Zitat:

Zitat von nikosch

Woher soll paypal hier kommen?

Mal schnell vom derzeitigen Kenntnissstand und ohne dein Link näher zu betrachten, geantwortet. Dein Link sehe ich mir gleich mal an.

onclick="check(paypal)"

Das ist der Wert, den ich an die JS-Funktion check übergebe.
Diese hat diesen dann weiter zu verarbeiten.

Mal schaun, was mir dein Link "beschert"

nikosch · 04.12.2011, 20:30

Vermutlich willst DU einen String übergeben. Du übergibst aber eine (leere) Variable.

daniel_1998 · 04.12.2011, 22:49

Zitat:

Zitat von nikosch

Vermutlich willst DU einen String übergeben. Du übergibst aber eine (leere) Variable.

Die Maskierung...

Okay. Jetzt klappt es so wie ich es mir wünsche.

Die Fehlerconsole meckert aber über etwas, was ich aber schon umgesetzt habe.

Code:

Warnung: Ein Element wurde im globalen Geltungsbereich per ID/Name referenziert. Verwenden Sie den W3C-Standard document.getElementById() stattdessen.

Da ich noch weit mehr an JS-functionen drin habe, habe den nachfolgenden Code mal aus JS rausgenommen und die Warnung kommt nicht mehr. Muß also daran liegen.

Code:

function check(zahlart)
{	
       if(zahlart=="nachnahme")
	   {
			aufpreis.style.visibility= "visible";
			document.getElementById("preis").firstChild.nodeValue = "<?php echo $nachnahme; ?>";
			
       }
	   else if(zahlart=="paypal")
	   {
			aufpreis.style.visibility= "visible";
			document.getElementById("preis").firstChild.nodeValue = "<?php echo $paypal; ?>";		   
	   }	   
	   else
	   { 
	   		aufpreis.style.visibility= "hidden";
       }	   
}

<span id="aufpreis" style="visibility:hidden; font-size:11px; color: red">(Der Aufpreis beträgt bei dieser Zahlungsoption: <b><span id="preis">Preisangabe per Javascript</span></b> Euro)</span>

Wie gesagt, arbeitet JS korrekt. Nur der Fehler selbst iritiert mich, weil ich getElementById ja einsetze.

Kann einer das Erklären ? (Soll ich den kompletten JS Code posten ca. weitere 30 zeilen)

nikosch · 04.12.2011, 22:52

Nein, Du verwendest

Zitat:

if(document.getElementById(paypal))

Wie gesagt, paypal muss entweder ein String sein, oder - DU willst ja eigentlich dynamisch arbeiten - eben die richtige Variable.

daniel_1998 · 09.12.2011, 12:26

Okay. Ich habe es nun soweit umgebaut, das es einwandfrei klappt.
Zumindest fast.

Es gibt ein Radiobutton, wo alle Varainten eines Artikels angezeigt werden.
Hat der Artikel mehr als eine Variante (also 2 z.B.) dann klappt mein unten aufgeführtes JS Script.
Habe ich aber nur eine Variante dann komme ich nicht in die JS Bedingung rein.

Hier jetzt erstmal [auszugsweise] den entsprechenden Code:

Code:

            for (var i=0, l = document.artikel.variante.length; i < l; i++)  
               {
				   //alert(i);
                   if (document.artikel.variante[i].checked)
                      {
						  alert(document.artikel.variante[i].checked);
                          var rad_val = document.artikel.preis[i].value;
                          url = url + '&preis=' + rad_val;
                          var rad_val = document.artikel.variante[i].value;
                          url = url + '&variante=' + rad_val;						  
                      }
               }

Wie man sieht habe ich schon ein wenig Debugging über das alert Feld betrieben. Bei einer Variante komme ich aber noch nicht mal in die for-Schleife rein. Sprich: Das alert Fenster bekomme ich nicht zu sehen.

Mach ich ein alert(document.artikel.variante.length); vor der schleife, bekomme ich ausgehend von einer Artikelvariante "undefined" zurück.
Öffne ich einen anderen Artikel mit z.B. 8 Varianten, erhalte ich daraufhin auch 8 zurück. Ebendfalls bin ich dann in der forschleife drin und erhalte auch die gewünschte Rückmeldung.

Mag jetzt noch jm. den Inhalt von <form> haben oder reichen die Informationen schon als Fehlermeldung aus ?

daniel_1998 · 09.12.2011, 19:02

gelöst... aber eher unelegant.

Finde ich irgendwie ein bissel inkonsequent von length.
Wenn es nur ein radiobutton gibt, gibt es ein undefined zurück.
Erst wenn 2 Radiobuttons auftauchen, gibt length was zurück.

Nunja. Nicht hübsch, weil Code teilweise doppelt.. aber es funzt.

PHP-Code:

  if (document.artikel.variante.length == undefined)     // Es gibt nur eine Variante

{

    document.artikel.variante.length = 1;

    if (document.artikel.variante.checked)

    {

      var rad_val = document.artikel.preis.value;

      url = url + '&preis=' + rad_val;

      var rad_val = document.artikel.variante.value;

      url = url + '&variante=' + rad_val;

    }

} 

else 

{

    for (var i=0, l = document.artikel.variante.length; i < l; i++)  // Mehrere Varianten. Durchlaufen

       {

           if (document.artikel.variante[i].checked)

              {

                  var rad_val = document.artikel.preis[i].value;

                  url = url + '&preis=' + rad_val;

                  var rad_val = document.artikel.variante[i].value;

                  url = url + '&variante=' + rad_val;                          

              }

       }

}

rudygotya · 09.12.2011, 19:39

Ist nicht inkonsequent von length. Einmal bekommst du ein DOM-Element zurück, einmal ein Array an DOM-Elementen.

PHP-Code:

  var preis = document.artikel.preis,
url = "",
variante = document.artikel.variante,
isArray = function ( obj ) {
    return !! ( obj && obj.concat && obj.unshift && !obj.callee )
},
getUrl = function ( preis, variante ) {
    return '&preis=' +  preis.value + '&variante=' + variante.value;
},
iterator = function ( preis, variante ) { 
    for( var i in preis ) {
        if( preis[ i ].checked ) {
            return getUrl( preis[ i], variante[ i ] || document.createElement( 'input' ) );
        }
        
    }
};

if( ! preis || ! variante ) throw new Error( "something gone wrong" );

url = ( isArray( preis) )
    ? iterator( preis, variante )
    : getUrl( preis, variante);

Komplett ungetestet und schnell hingeschmiert. Den Iterator könnt man auch gleich als lambda schreiben. Für den DOM-Zugriff solltest du dir irgendeins der x DOM-Frameworks raussuchen, so ist das grausam, und .. fühlt ... sich.. falsch .. an.

P.S.: Variablen am besten nur einmal deklarieren (rad_val)

Grüße

Basti

daniel_1998 · 09.12.2011, 19:45

arghh... ich hatte glaube ich noch nicht erwähnt, das ich JS Anfänger bin (?)

Was für ein Code... da bin ich Tage damit beschäftigt, den auseinander zu bauen und zu verstehen.

Auch auf den 2ten / 3ten Blick bleiben viele

Wobei ich vieles aus PHP an Befehlssätzen wieder erkenne.

Nunja.... danke erstmal für's runtertippen. Bin grad noch an einer anderen JS Problematik dran... danach werd ich mich mal mit dein Vorschlag beschäftigen.

Danke

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Thema bewerten
Thema bewerten:

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Wert einer Checkbox dynamisch zuteilen?	Anima	PHP Einsteiger	4	04.11.2011 22:37
Checkbox Abfrage verknüpfen	Sickone4	PHP Einsteiger	22	08.09.2011 11:25
[Erledigt] PDO - Checkbox	Inchie	PHP Einsteiger	2	02.03.2011 17:08
[Erledigt] Checkbox onchange	Buschdieb	JavaScript, Ajax und mehr	3	03.10.2010 14:51
[Erledigt] Gegenteil von onClick()	mkn	JavaScript, Ajax und mehr	2	29.09.2010 13:44
Checkbox -> mehrere Einträge löschen (SQL)	Minimi	PHP Tipps 2010	8	08.04.2010 17:41
LOGIN mit Checkbox	Emskopp	PHP Tipps 2009	16	27.12.2009 19:20
selectboxen durch checkbox aktivieren	grunz	JavaScript, Ajax und mehr	13	30.08.2009 17:02
[Erledigt] Checkbox Zustand aus DB auslesen	Knutschi	PHP Tipps 2009	22	05.05.2009 14:02
[Erledigt] onclick problem bei checkbox	familyman	JavaScript, Ajax und mehr	5	31.01.2009 19:39
Aktivieren einer Checkbox aktiviert viele andere Checkboxen	buggybugga	HTML, Usability und Barrierefreiheit	3	12.03.2007 16:23
Checkbox	jacos	PHP Tipps 2006	5	01.04.2006 10:19
checkbox .. mehrere werte auslesen bei gleichem namen		PHP Tipps 2005-2	9	12.10.2005 15:24
Variable mit onClick übergeben?		PHP Tipps 2005-2	2	22.09.2005 15:33
[Erledigt] Checkbox - Übergabe mehrerer Werte	patr1k	HTML, Usability und Barrierefreiheit	6	16.03.2005 11:25

04.12.2011, 19:11
daniel_1998 Benutzer Registriert seit: 27.11.2011 Beiträge: 64 PHP-Kenntnisse: Anfänger	[Erledigt] Checkbox mit onClick Hi, ich versuche mit JS ein div ein und später dann wieder auszublenden, wenn gewisse Bedingungen erfüllt sind. Aktuell habe ich das zusammengebaut: JS Code: var zahlart = false; function check(zahlart) { alert(zahlart); if(document.getElementById(paypal)) { var ele = document.getElementById(zahlart); if(ele.style.visibility=="hidden") { ele.style.visibility="visible"; } else { ele.style.visibility="hidden"; } } } PHP PHP-Code: `echo '<td width="50%"><input type="radio" name="zahlart" '.(($daten->dtype == key($zahlart[$i])) ? 'checked="checked" ' : '').' value="'.key($zahlart[$i]).'" onClick="check('.key($zahlart[$i]).')">'.current($zahlart[$i]).'</td>'; <div id="aufpreis" style="visibility:hidden;"> <span>Der Aufpreis beträgt bei dieser Zahlungsoption: xxx Euro </span> </div>` Der PHP Code ist in einer Schleife. Dieser sieht dann wie folgt aus: Code: <input type="radio" onclick="check(paypal)" value="paypal" name="zahlart"> Wenn ich nun Paypal anklicke sollte meines Verständniss nach die JS-function "check" aufgerufen werden. Zur debugging habe ich dort auch schon ein alert eingebaut. Bekomme dies aber nicht raus. Firebug zeig mir nur den Fehler an, das paypal nicht definiert ist. Aber ich glaube, dass das nur eine Warnung ist, die das alert fenster zumindest nicht unterdrücken sollte. Da ich leider nicht mehr an Fehler zurückbekomme, muß ich hier mal die erfahrender Fraktion fragen, woran es liegen könnte. Habt Dank


Mister Ad PHP Code Flüsterer Registriert seit: 21.08.2005 Beiträge: 4682 PHP-Kenntnisse: Fortgeschritten

04.12.2011, 20:30
nikosch moderatives Dielektrikum Registriert seit: 21.05.2008 Beiträge: 35.987 PHP-Kenntnisse: Fortgeschritten	Vermutlich willst DU einen String übergeben. Du übergibst aber eine (leere) Variable. __________________ -- One pixel is still too big. Please make it smaller. ASAP. Initiative Mittelstand. Die wichtigste Gestaltungsregel im Screendesign ist Pi mal Daumen des Arbeitgebers. --

09.12.2011, 12:26
daniel_1998 Benutzer Registriert seit: 27.11.2011 Beiträge: 64 PHP-Kenntnisse: Anfänger	Okay. Ich habe es nun soweit umgebaut, das es einwandfrei klappt. Zumindest fast. Es gibt ein Radiobutton, wo alle Varainten eines Artikels angezeigt werden. Hat der Artikel mehr als eine Variante (also 2 z.B.) dann klappt mein unten aufgeführtes JS Script. Habe ich aber nur eine Variante dann komme ich nicht in die JS Bedingung rein. Hier jetzt erstmal [auszugsweise] den entsprechenden Code: Code: for (var i=0, l = document.artikel.variante.length; i < l; i++) { //alert(i); if (document.artikel.variante[i].checked) { alert(document.artikel.variante[i].checked); var rad_val = document.artikel.preis[i].value; url = url + '&preis=' + rad_val; var rad_val = document.artikel.variante[i].value; url = url + '&variante=' + rad_val; } } Wie man sieht habe ich schon ein wenig Debugging über das alert Feld betrieben. Bei einer Variante komme ich aber noch nicht mal in die for-Schleife rein. Sprich: Das alert Fenster bekomme ich nicht zu sehen. Mach ich ein alert(document.artikel.variante.length); vor der schleife, bekomme ich ausgehend von einer Artikelvariante "undefined" zurück. Öffne ich einen anderen Artikel mit z.B. 8 Varianten, erhalte ich daraufhin auch 8 zurück. Ebendfalls bin ich dann in der forschleife drin und erhalte auch die gewünschte Rückmeldung. Mag jetzt noch jm. den Inhalt von <form> haben oder reichen die Informationen schon als Fehlermeldung aus ?

09.12.2011, 19:02
daniel_1998 Benutzer Registriert seit: 27.11.2011 Beiträge: 64 PHP-Kenntnisse: Anfänger	gelöst... aber eher unelegant. Finde ich irgendwie ein bissel inkonsequent von length. Wenn es nur ein radiobutton gibt, gibt es ein undefined zurück. Erst wenn 2 Radiobuttons auftauchen, gibt length was zurück. Nunja. Nicht hübsch, weil Code teilweise doppelt.. aber es funzt. PHP-Code: if (document.artikel.variante.length == undefined) // Es gibt nur eine Variante { document.artikel.variante.length = 1; if (document.artikel.variante.checked) { var rad_val = document.artikel.preis.value; url = url + '&preis=' + rad_val; var rad_val = document.artikel.variante.value; url = url + '&variante=' + rad_val; } } else { for (var i=0, l = document.artikel.variante.length; i < l; i++) // Mehrere Varianten. Durchlaufen { if (document.artikel.variante[i].checked) { var rad_val = document.artikel.preis[i].value; url = url + '&preis=' + rad_val; var rad_val = document.artikel.variante[i].value; url = url + '&variante=' + rad_val; } } }

09.12.2011, 19:39
rudygotya Erfahrener Benutzer Registriert seit: 28.05.2008 Beiträge: 2.094 PHP-Kenntnisse: Fortgeschritten	Ist nicht inkonsequent von length. Einmal bekommst du ein DOM-Element zurück, einmal ein Array an DOM-Elementen. PHP-Code: var preis = document.artikel.preis, url = "", variante = document.artikel.variante, isArray = function ( obj ) { return !! ( obj && obj.concat && obj.unshift && !obj.callee ) }, getUrl = function ( preis, variante ) { return '&preis=' + preis.value + '&variante=' + variante.value; }, iterator = function ( preis, variante ) { for( var i in preis ) { if( preis[ i ].checked ) { return getUrl( preis[ i], variante[ i ] \|\| document.createElement( 'input' ) ); } } }; if( ! preis \|\| ! variante ) throw new Error( "something gone wrong" ); url = ( isArray( preis) ) ? iterator( preis, variante ) : getUrl( preis, variante); Komplett ungetestet und schnell hingeschmiert. Den Iterator könnt man auch gleich als lambda schreiben. Für den DOM-Zugriff solltest du dir irgendeins der x DOM-Frameworks raussuchen, so ist das grausam, und .. fühlt ... sich.. falsch .. an. P.S.: Variablen am besten nur einmal deklarieren (rad_val) Grüße Basti __________________ ++++ Wieder einer ins Netz gegangen: Phishers Fritz zufrieden ++++ Blog Geändert von rudygotya (09.12.2011 um 20:49 Uhr).

09.12.2011, 19:45
daniel_1998 Benutzer Registriert seit: 27.11.2011 Beiträge: 64 PHP-Kenntnisse: Anfänger	arghh... ich hatte glaube ich noch nicht erwähnt, das ich JS Anfänger bin (?) Was für ein Code... da bin ich Tage damit beschäftigt, den auseinander zu bauen und zu verstehen. Auch auf den 2ten / 3ten Blick bleiben viele Wobei ich vieles aus PHP an Befehlssätzen wieder erkenne. Nunja.... danke erstmal für's runtertippen. Bin grad noch an einer anderen JS Problematik dran... danach werd ich mich mal mit dein Vorschlag beschäftigen. Danke