elitepvpers - Help: HTML/PHP Checkbutton um eine Seite zu vergleichen

elitepvpers (https://www.elitepvpers.com/forum/)

- Web Development (https://www.elitepvpers.com/forum/web-development/)

- - Help: HTML/PHP Checkbutton um eine Seite zu vergleichen (https://www.elitepvpers.com/forum/web-development/2597050-help-html-php-checkbutton-um-eine-seite-zu-vergleichen.html)

CazZam

05/14/2013 21:13

Help: HTML/PHP Checkbutton um eine Seite zu vergleichen

Hey Freunde,
ich habe eine dringende Hilfe...
Ich habe ein Projekt, auf das ich jetzt nicht genauer eingehen will, man aber Englisch üben kann.
Man kann dort zwischen verschiedenen Formen von z.B. to do wählen. Am Schluss gibt es einen Check button.

Jetzt mein Problem:
Ich habe alles mit HTML bzw. css geschrieben, und weiß leider nicht wie man es macht, dass dann dieser "Check Button" die Seite vergleicht und zeigt was falsch ist.
Der Sinn davon ist, dass wenn man die Aufgaben gemacht hat, man auf Check drückt, und hinter den Aufgaben z.B. ein Haken ist, wenn diese richtig beantwortet wurde, wenn nicht soll dieses mit einem roten Minus markiert werden und die richtige Lösung angezeigt werden.

Nun meine Frage:
Wie kann man diesen Check Button dazu bringen, dass er die Seite mit vorgebenen Lösungen vergleicht?
Hab jede Menge gegooglet, und kam schon soweit, dass man hierzu PHP benötige. In PHP bin ich allerdings ein absoluter Anfänger, daher bitte ich euch, mir eine kleine Erläuterung zu geben. Wäre wirklich nett!

Danke im voraus,

Mfg

マルコ	05/14/2013 22:52

Dazu solltest du Javascript lernen. Anders geht das nicht. Ein Vergleich ist eine logische Operation, keine Darstellung.
Von PHP rate ich ab. Das ist nur unnötiger Traffic und eher schwieriger umzusetzen als mit Javascript.

Im Prinzip machst du folgendes (nur solltest du zuerst alle Felder prüfen und erst wenn alle stimmen die Checkbox toggeln.):

Code:

$result = true;

$left = document.myForm.Form1Element.value;

$right = document.myForm.Form2Element.value;

if($left != $right)

  $result = false;



//test all other elements



document.getElementById("myCheckBox").checked = $result;

*Ich hoffe, das stimmt so. Ich wollte zur Abwechslung auf die Verwendung von jQuery verzichten. Wäre evtl sonst zu viel auf einmal.^^

Mikesch01

05/15/2013 17:56

Code:

var result = true;

var leftVal = document.myForm.Form1Element.value;

var rightVal = document.myForm.Form2Element.value;

if(leftVal != rightVal)

  result = false;



//test all other elements



document.getElementById("myCheckBox").checked = result;

Quote:

Originally Posted by マルコ (Post 22705927)

*Ich hoffe, das stimmt so. Ich wollte zur Abwechslung auf die Verwendung von jQuery verzichten. Wäre evtl sonst zu viel auf einmal.^^

Seit wann verwendet man in JS ein Dollarzeichen für eine Variable? :) ;)
Habe nur mal die Variablen ausgebessert, weiss nicht ob dein Code trotzdem richtig ist oder nicht.

マルコ	05/15/2013 18:51

Quote:

Originally Posted by Mikesch01 (Post 22716570)

Seit wann verwendet man in JS ein Dollarzeichen für eine Variable? :) ;)

Nja, seitdem ich PHP benutze. Ich finde das übersichtlicher.

Quote:

Originally Posted by Mikesch01 (Post 22716570)

Habe nur mal die Variablen ausgebessert, weiss nicht ob dein Code trotzdem richtig ist oder nicht.

Und Variablen müssen nicht mit var deklariert werden. Zumindest nicht auf globaler Ebene.
Aber ist wahrscheinlich besser so, weil es ja in ne Funktion gekapselt werden muss (sry^^)

MrSm!th

05/17/2013 15:56

General Coding -> Web Development

#moved

CazZam

06/04/2013 23:56

Also das mit den if-Befehlen verstehe ich.
Nur wie mache ich das, dass diese if Befehle erst nach Drücken des Check Buttons ausgeführt werden?

マルコ	06/05/2013 08:51

Du weißt schon, wie ein Button als HTML aussieht?
Du führst die Funktion als onClick Event aus!

Code:

<input type="button" value="Do It!" onClick="myFunction();">

xyNNNNNN

06/05/2013 09:58

Seit wann funktioniert so etwas nicht mit PHP? ;)

マルコ	06/05/2013 10:44

Quote:

Originally Posted by xyNNNNNN (Post 23095141)

Seit wann funktioniert so etwas nicht mit PHP? ;)

Wer sagt, dass es nicht mit PHP ginge? Aber PHP wäre hier einfach falsch. Das ist unnötiger Traffic, der erzeugt würde.

Bgzocker

06/05/2013 11:06

Quote:

Originally Posted by マルコ (Post 23095456)

Wer sagt, dass es nicht mit PHP ginge? Aber PHP wäre hier einfach falsch. Das ist unnötiger Traffic, der erzeugt würde.

wäre aber für Anfänger einfacher, oder?

マルコ	06/05/2013 11:53

Quote:

Originally Posted by Bgzocker (Post 23095672)

wäre aber für Anfänger einfacher, oder?

nein, absolut nicht. PHP ist _nicht_ einfacher als JS. Wieso auch?
PHP wäre eher komplizierter, weil man erstmal eine Form erzeugen müsste, die alles korrekt abschickt. Und dann müsste das PHP Script die Form beim Abschicken wieder befüllen. Und den Checkbutton setzen.
In JS kann man sich rein auf die Aufgabe konzentrieren.
Texte vergleichen und Checkbutton setzen.

derdave969

06/05/2013 16:01

Der nachteil an JS ist einfach der, dass man es im Browser deaktivieren kann.
z.B mit NoScript ;)
Und traffic ist ja jetzt in der heutigen Zeit echt nicht mehr das Problem.
Noch haben wir nicht 2016 und die Telekomm drosselt auch noch nicht. Warum also nicht auf der sicheren Seite bleiben und das ganze in PHP realisieren?

Nur mal so meine Gedanken, nachdem ich den Thread überflogen habe :D

Edit:
Wenn ich nachher daheim bin und noch Zeit hab schreib ich dir nen kleinen Code ;)

マルコ	06/05/2013 16:17

Quote:

Originally Posted by derdave969 (Post 23099878)

Der nachteil an JS ist einfach der, dass man es im Browser deaktivieren kann.
z.B mit NoScript ;)

[...]

Warum also nicht auf der sicheren Seite bleiben und das ganze in PHP realisieren?

Ja und? Wie viele Leute deaktivieren ihr JS? Wie viele Leute, die seine Seite besuchen, falls sie überhaupt öffentlich ist?

Quote:

Originally Posted by derdave969 (Post 23099878)

Und traffic ist ja jetzt in der heutigen Zeit echt nicht mehr das Problem.
Noch haben wir nicht 2016 und die Telekomm drosselt auch noch nicht.

Nunja, wenn du nen Server hast, auf dem so und so viele Homepages laufen, und da meint einer dann, er müsste ne Doktorarbeit vergleichen lassen... Ich denke schon, dass das ganz schön Traffic macht, 2 riesen texte zu verschicken und anschließend wieder 2 riesen Texte zu downloaden - nur damit sie verglichen werden. Es geht einfach nicht ineffizienter! Leistung und Aufwand stehen absolut in keinem Verhältnis!
Ich denke, du gehörst zu denen, die bei höherer Besucherzahl sich dann fragen, warum alles so langsam ist, und einen stärkeren Server kaufen.
Einfach nur Schwachsinn. Meine Meinung.

Fakt ist, wenn ich vor diesem Problem sitzen würde und dafür Geld erhalten würde (35€ mind. mein Stundenlohn), dass ich das für jeden nutzbar umsetze, dann würde ich das zuerst in JS lösen. Statt einem Button würde ich ein submit Input verwenden und das ganze in eine Form packen. onClick würde dann false returnen, um die default Aktion zu unterbinden. Damit wäre es effizient und für jeden nutzbar.

Aber zur reinen Übung ist das Schwachsinn. Und für jede normale Homepage auch. Die einfachste, effizienteste und anfängerfreundlichste Lösung ist und bleibt JS.
Ich verstehe einfach nicht, warum ihr dem armen Kerl was anderes einreden wollt.

CazZam

06/05/2013 17:06

Hey, ich bins nochmal.
Danke für die zahlreichen Antworten und tut mir leid, dass ich mich so dumm anstelle, aber ich komme einfach nicht weiter.

Der Zweck: Entscheiden, ob das Statement "Tom do his homework." so richtig oder falsch ist (also mit Radiobuttons anklicken, dann auf Check drücken).
Ich will, dass sich ein Fenster öffnet, dass, wenn es richtig beantwortet wurde, ausgegeben wird: "Great!". Wenn es falsch beantwortet wird: "Sorry, thats wrong! Try again!"
Seht ihr vielleicht einen Fehler?

HTML Code:

<!DOCTYPE html>

<html>

    <head>

            <title>Hilfe</title>



                                <script>

                                

 function vergleiche()

{ 



 var true = document.getElementById("radioTrue");

 var false = document.getElementById("radioFalse");

        

        if(true.checked)

        {

                alert("Sorry, thats wrong! Try again!");

        }

        else if(false.checked) 

        {

                alert("Great!");

        }

}

                                </script>



        </head>

                        

<body style="background-color:#FFFFCC">

                        

        <table>

        <colgroup width="150" span="3"></colgroup>

        <thead>           

                        <tr>

            <th>Statement</th>

            <th>True</th>

            <th>False</th>

                        </tr>

                

        </thead>

            

                <tbody>



                <tr>

            <td align="center">Tom do his homework.</td>

            

            <td align="center"><input type="radio" id="radioTrue" name="Radio" value="True"></td>

               

            <td align="center"><input type="radio" id="radioFalse" name="Radio" value="False"></td>

        



                </tr>

                 </tbody>

        </table>

        <br>

                 

                 <input type="button" value="Check!" onClick="vergleiche()">

                 

                 

</body>

</html>

Ich finde da irgendwie keinen Fehler, ich such schon ewig :(
Danke im voraus!

flogi333

06/05/2013 17:20

Quote:

var true = document.getElementById("radioTrue");
var false = document.getElementById("radioFalse");

Du darfst deine Variablen nicht true oder false nennen..
Das sind reservierte Wörter

CazZam

06/05/2013 17:26

Ahh oh mein Gott, was für ein dummer Fehler :D Danke vielmals!

Noch eine Frage. Ist es möglich nicht ein Fenster erscheinen zu lassen, sondern evtl. ein Bild neben diesem False Radiobutton erscheinen zu lassen? (ein grüner Haken z.B.)?
Bzw. wie mache ich das, dass es eben genau neben diesem False Radiobutton erscheint?
Wenn ja, kann mir da einer weiterhelfen?

Danke im voraus!

マルコ	06/05/2013 17:27

Nunja. Ich sehe eine Menge stilistische Probleme. <script> sollte das letzte Element im Body sein, damit die Homepage laden kann, ohne von Scripten aufgehalten zu werden.
Keine Style Tags verwenden. Dafür gibt es CSS.
Schau dir auch nochmal HTML5 Meta Tags an.
In der Programmierung ist es besser, im Englischen zu bleiben. Also keine deutschen Funktions-/ Variablennamen.
In der Programmierung sind true und false belegte Ausdrücke. AUS GENAU DIESEM GRUND ist es sinnvoll, vor Variablen ein Dollarzeichen zu setzen!
Zudem ist das 2. If überflüssig. In einem größeren Script würden solche Sachen Performance kosten.

Die funktionierende Fassung ist hier:

[Only registered and activated users can see links. Click Here To Register...]

Zu deiner 2. Frage: Einfach ein bild daneben setzen und dieses auf display:none; setzen. Bei entsprechendem Ergebnis diese Eigenschaft toggeln. Das ist am einfachsten. Ansonsten das Bild als HTML einfügen. Ich würd mir dafür aber lieber jQuery anschauen. Ist komfortabler.

CazZam

06/05/2013 17:31

Herlichen Dank, da hast du Recht.
Danke für die ganzen Tipps! Bin noch ein ziemlicher Neuling.

マルコ	06/05/2013 17:33

Noch n Tipp für die Verwendung von HTML5: Such mal nach "HTML5 Boilerplate". Das ist ein Template, das imho jeder HTML5 Seite zugrunde liegen sollte.

CazZam

06/05/2013 17:38

Dankesehr! Bist mir echt eine große Hilfe!

マルコ	06/05/2013 17:41

Quote:

Originally Posted by マルコ (Post 23101646)

Zu deiner 2. Frage: Einfach ein bild daneben setzen und dieses auf display:none; setzen. Bei entsprechendem Ergebnis diese Eigenschaft toggeln. Das ist am einfachsten. Ansonsten das Bild als HTML einfügen. Ich würd mir dafür aber lieber jQuery anschauen. Ist komfortabler.

Wie bereits geschrieben, der einfachste Ansatz, oder so, wie du es später machen solltest.

All times are GMT +2. The time now is 17:03.