Themen-Optionen Ansicht
Alt 17.04.2012, 16:30   #1
JensL
Administrator
Site Admin
 
Registriert seit: 02.03.2010
Beiträge: 2.470
JensL befindet sich auf einem aufstrebenden Ast
Wie kann ich Werte auf einer Seite in Echtzeit addieren?
Sie möchten sicherstellen, dass die vom Teilnehmer eingegebenen Werte in offenen Eingabefeldern in der Summe einen gewissen Wert nicht überschreiten. Gleichzeitig möchten Sie diese Summe in Echtzeit anzeigen lassen.
Hierzu müssen Sie zunächst das folgende Javascript in Ihrer Umfrage mit Hilfe von 998 und 911 Fragetypen implementieren.
Da Sie die Frage welche die Texteingabefelder enthält manuell nachbauen müssen, verwenden Sie hierfür bitte den 911er Fragetypen.
Um die Sache zu vereinfach, können Sie die Frage zunächst mit den Standardfragetypen anlegen und danach in eine 911er-Frage umwandeln, auf diesem Weg haben Sie direkt den HTML-Code in der richtigen Form vorliegen.

Bitte beachten Sie, dass die funktionale Effizienz des Skripts sowohl von der Konfiguration als auch der technischen Infrastruktur Ihres Systems abhängt (z.B. Betriebssystem, Browser, Software Version).
Code:
<script language="JavaScript"> <!-- var max=100; function ViewSum(SumId) { var nCounter; var nSum=0; var MyInputCollection=document.getElementsByTagName("input"); for (nCounter=0;nCounter<MyInputCollection.length;nCounter++) { if (MyInputCollection[nCounter].getAttribute("Id")==SumId) { if (MyInputCollection[nCounter].value!="" && parseInt(MyInputCollection[nCounter].value) != NaN) { nSum += parseInt(MyInputCollection[nCounter].value); } else { nSum = nSum; } } } if(nSum <= max) { document.getElementById("Result").innerHTML=nSum; } } --> </script>
Die Variable max definiert den maximalen Wert den der Nutzer eingeben kann. Danach müssen Sie die Eingabefelder anpassen, in der die Summanden später eingetragen werden.
Jedes Feld (imput-Tag) muss eine ID erhalten und die zuvor gezeigte Javascript Funktion aufrufen.

Code:
<input type="text" name="v_138" value="" size="3" maxlength="3" >
wird geändert zu:

Code:
<input type="text" onblur="ViewSum('SumA');" Id="SumA" name="v_138" value="" size="3" maxlength="3" >
Hier wird die Javascript-Funktion ViewSum('SumA') in den Tag eingefügt und die entsprechende ID vergeben. Hiernach muss besagte ID im Javascript-Funktionsaufruf referenziert werden.
ID und Parameter müssen hierbei übereinstimmen.

Die ID's müssen für jedes Array welches später Teil der Summe sein sollen übereinstimmen.

Als letztes müssen Sie noch ein Feld definieren, in dem das Ergebnis ausgegeben wird. Um dies zu tun, fügen Sie eine neue Zelle in die Tabelle ein und geben ihr die ID "result". Diese Zelle wird das Ergebnis enthalten.
Beispiel:
Code:
<td Id="Result"></td>
Es empfiehlt sich die Felder passend vorzubelegen. Der Code für dieses Beispiel sähe wie folgt aus:

Code:
<script language="JavaScript"> <!-- var max=100; function ViewSum(SumId) { var nCounter; var nSum=0; var MyInputCollection=document.getElementsByTagName("input"); for (nCounter=0;nCounter<MyInputCollection.length;nCounter++) { if (MyInputCollection[nCounter].getAttribute("Id")==SumId) { if (MyInputCollection[nCounter].value!="" && parseInt(MyInputCollection[nCounter].value) != NaN) { nSum += parseInt(MyInputCollection[nCounter].value); } else { nSum = nSum; } } } if(nSum <= max) { document.getElementById("Result").innerHTML=nSum; } } --> </script> <table border="0" cellspacing=0 cellpadding=0 > <tr> <td>The eye test: </div></td> <td> <input type="text" onblur="ViewSum('SumA');" Id="SumA" name="v_138" value=" #v_138#" size="3" maxlength="3" >points </td> <td></td> </tr> <tr> <td>Purchasing eye correcting glasses:</td> <td> <input type="text" onblur="ViewSum('SumA');" Id="SumA" name="v_139" value=" #v_139#" size="3" maxlength="3" >points </td> <td></td> </tr> <tr> <td> <b>CURRENT TOTAL:</b></td> <td Id="Result"></td> <td></td> </tr> </table>
JensL ist offline  
 


Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge anzufügen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

vB Code ist An.
Smileys sind An.
[IMG] Code ist An.
HTML-Code ist Aus.
Gehe zu


Alle Zeitangaben in WEZ +1. Es ist jetzt 22:19 Uhr.

unipark
© Copyright 2011 QuestBack GmbH - Unipark Forum Onlineforschung | Unipark Online-Umfrage Tool | kontakt | impressum |