richi_f Medlem sedan apr. 2004 206 inlägg Frågan 8 feb. 2008 16:02 #1 Hej alla javakunniga!
Jag skulle vilja ha ett litet script som räknar ut en totalsumma ifrån ett gäng kryssrutor.
Alltså
a. 0 1 2 3
b. 0 1 2 3
c. 0 1 2 3
Totalt=
Nån som vet om det finns ett sånt nånstans?
P Peter S Medlem sedan dec. 2002 5 483 inlägg var cbs = ["a","b","c"];
var elms = document.forms["myForm"].elements;
var total = 0;
for (var i = 0; i < cbs.length; ++i)
{
var cb = elms[cbs[i]];
for (var j = 0; j < cb.length; ++j)
if (cb[j].checked)
total += parseInt(cb[j].value);
}
...
document.write(total);
Ange namnen på checkboxarna i 'cbs', sedan kan du använda dig av 'total' för att visa det sammanräknade värdet.
richi_f Medlem sedan apr. 2004 206 inlägg Hmm, är dålig på detta. Hur ska jag få till det?
Jag skulle vilja skicka vidare till en sida där besökaren får resultatet.
Det ska vara 13 frågor och om poängen är under <17 ska det bli ett resultat, om det är <30 ett annat och >30 ett tredje ;)
Tacksam för all hjälp! ;)
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script type="text/javascript">
var cbs = ["a","b","c"];
var elms = document.forms["myForm"].elements;
var total = 0;
for (var i = 0; i < cbs.length; ++i)
{
var cb = elms[cbs[i]];
for (var j = 0; j < cb.length; ++j)
if (cb[j].checked)
total += parseInt(cb[j].value);
}
</script>
</head>
<body>
<P>
document.write(total);
<form id="form1" name="form1" method="post" action="">
<label>Fråga 1:<br />
<input type="checkbox" name="checkbox1_0" value="checkbox" />
0</label>
<label>
<input type="checkbox" name="checkbox1_1" value="checkbox" />
1</label>
<label>
<input type="checkbox" name="checkbox1_2" value="checkbox" />
2</label>
<label>
<input type="checkbox" name="checkbox1_3" value="checkbox" />
3</label>
<br />
<br />
Fråga 2:<br />
<label>
<input type="checkbox" name="checkbox2_0" value="checkbox" />
0</label>
<label>
<input type="checkbox" name="checkbox2_1" value="checkbox" />
1</label>
<label>
<input type="checkbox" name="checkbox2_2" value="checkbox" />
2</label>
<label>
<input type="checkbox" name="checkbox2_3" value="checkbox" />
3</label>
</form>
</P>
</body>
</html>
P Peter S Medlem sedan dec. 2002 5 483 inlägg <html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script type="text/javascript">
function calc(f)
{
var cbprefix = "checkbox";
var elms = f.elements;
var total = 0;
for (var i = 0; i < 13; ++i){
var cb = cbprefix + (i+1) + "_";
for (var j = 0; j < 4; ++j){
if (elms[cb + j].checked){
total += parseInt(elms[cb + j].value);
}
}
}
if (total < 17) total = "a";
else if (total < 30) total = "b";
else total = "c";
elms["total"].value = total;
}
</script>
</head>
<body>
<P>
<form id="form1" name="form1" onsubmit="calc(this)" method="post" action="">
<label>Fråga 1:<br />
<input type="checkbox" name="checkbox1_0" value="0" />
0</label>
<label>
<input type="checkbox" name="checkbox1_1" value="1" />
1</label>
<label>
<input type="checkbox" name="checkbox1_2" value="2" />
2</label>
<label>
<input type="checkbox" name="checkbox1_3" value="3" />
3</label>
<br />
<br />
Fråga 2:<br />
<label>
<input type="checkbox" name="checkbox2_0" value="0" />
0</label>
<label>
<input type="checkbox" name="checkbox2_1" value="1" />
1</label>
<label>
<input type="checkbox" name="checkbox2_2" value="2" />
2</label>
<label>
<input type="checkbox" name="checkbox2_3" value="3" />
3</label>
<input type="hidden" name="total" />
</form>
</P>
</body>
</html>
richi_f Medlem sedan apr. 2004 206 inlägg Tillbaka igen...
Hej igen. Är ingen kung på javascript tyvärr.
Jo, jag skulle vilja få upp en skylt med resultatet, alltså ex:
Ditt resultat blev 27 - Bla bla bla
Alltså tre olika skyltar...
om poängen är under <17 ska det bli en skylt, om det är <30 en annan och >30 en tredje
Då måste jag använda mig av alert va? Men hur får jag till det...
Peter S, kan jag återgälda din hjälp på nåt sätt? En digital semla kanske?
:birp
Innan head:
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script type="text/javascript">
function calc(f)
{
var cbprefix = "checkbox";
var elms = f.elements;
var total = 0;
for (var i = 0; i < 13; ++i){
var cb = cbprefix + (i+1) + "_";
for (var j = 0; j < 4; ++j){
if (elms[cb + j].checked){
total += parseInt(elms[cb + j].value);
}
}
}
if (total < 17) total = "a";
else if (total < 30) total = "b";
else total = "c";
elms["total"].value = total;
}
</script>
</head>
body:
<body>
<P>
<form onsubmit="return total()" action="">
<label>Fråga 1:<br />
<input type="checkbox" name="checkbox1_0" value="checkbox1_0" />
0</label>
<label>
<input type="checkbox" name="checkbox1_1" value="checkbox1_1" />
1</label>
<label>
<input type="checkbox" name="checkbox1_2" value="checkbox1_2" />
2</label>
<label>
<input type="checkbox" name="checkbox1_3" value="checkbox1_3" />
3</label>
<br />
<br />
Fråga 2:<br />
<label>
<input type="checkbox" name="checkbox2_0" value="checkbo2_0x" />
0</label>
<label>
<input type="checkbox" name="checkbox2_1" value="checkbox2_1" />
1</label>
<label>
<input type="checkbox" name="checkbox2_2" value="checkbox2_2" />
2</label>
<label>
<input type="checkbox" name="checkbox2_3" value="checkbox2_3" />
3</label>
<br />
<br />
Fråga 3:<br />
<label>
<input type="checkbox" name="checkbox3_0" value="checkbox3_0" />
0</label>
<label>
<input type="checkbox" name="checkbox3_1" value="checkbox3_1" />
1</label>
<label>
<input type="checkbox" name="checkbox3_2" value="checkbox3_2" />
2</label>
<label>
<input type="checkbox" name="checkbox3_3" value="checkbox3_3" />
3</label>
<br />
<br />
Fråga 4:<br />
<label>
<input type="checkbox" name="checkbox4_0" value="checkbox4_0" />
0</label>
<label>
<input type="checkbox" name="checkbox4_1" value="checkbox4_1" />
1</label>
<label>
<input type="checkbox" name="checkbox4_2" value="checkbox4_2" />
2</label>
<label>
<input type="checkbox" name="checkbox4_3" value="checkbox4_3" />
3</label>
<br />
<br />
Fråga 5:<br />
<label>
<input type="checkbox" name="checkbox5_0" value="checkbox5_0" />
0</label>
<label>
<input type="checkbox" name="checkbox5_1" value="checkbox5_1" />
1</label>
<label>
<input type="checkbox" name="checkbox5_2" value="checkbox5_2" />
2</label>
<label>
<input type="checkbox" name="checkbox5_3" value="checkbox5_3" />
3</label>
<br />
<br />
Fråga 6:<br />
<label>
<input type="checkbox" name="checkbox6_0" value="checkbox6_0" />
0</label>
<label>
<input type="checkbox" name="checkbox6_1" value="checkbox6_1" />
1</label>
<label>
<input type="checkbox" name="checkbox6_2" value="checkbox6_2" />
2</label>
<label>
<input type="checkbox" name="checkbox6_3" value="checkbox6_3" />
3</label>
<br />
<br />
Fråga 7:<br />
<label>
<input type="checkbox" name="checkbox7_0" value="checkbox7_0" />
0</label>
<label>
<input type="checkbox" name="checkbox7_1" value="checkbox7_1" />
1</label>
<label>
<input type="checkbox" name="checkbox7_2" value="checkbox7_2" />
2</label>
<label>
<input type="checkbox" name="checkbox7_3" value="checkbox7_3" />
3</label>
<br />
<br />
Fråga 8:<br />
<label>
<input type="checkbox" name="checkbox8_0" value="checkbox8_0" />
0</label>
<label>
<input type="checkbox" name="checkbox8_1" value="checkbox8_1" />
1</label>
<label>
<input type="checkbox" name="checkbox8_2" value="checkbox8_2" />
2</label>
<label>
<input type="checkbox" name="checkbox8_3" value="checkbox8_3" />
3</label>
<br />
<br />
Fråga 9:<br />
<label>
<input type="checkbox" name="checkbox9_0" value="checkbox9_0" />
0</label>
<label>
<input type="checkbox" name="checkbox9_1" value="checkbox9_1" />
1</label>
<label>
<input type="checkbox" name="checkbox9_2" value="checkbox9_2" />
2</label>
<label>
<input type="checkbox" name="checkbox9_3" value="checkbox9_3" />
3</label>
<br />
<br />
Fråga 10:<br />
<label>
<input type="checkbox" name="checkbox10_0" value="checkbox10_0" />
0</label>
<label>
<input type="checkbox" name="checkbox10_1" value="checkbox10_1" />
1</label>
<label>
<input type="checkbox" name="checkbox10_2" value="checkbox10_2" />
2</label>
<label>
<input type="checkbox" name="checkbox10_3" value="checkbox10_3" />
3</label>
<br />
<br />
Fråga 11:<br />
<label>
<input type="checkbox" name="checkbox11_0" value="checkbox11_0" />
0</label>
<label>
<input type="checkbox" name="checkbox11_1" value="checkbox11_1" />
1</label>
<label>
<input type="checkbox" name="checkbox11_2" value="checkbox11_2" />
2</label>
<label>
<input type="checkbox" name="checkbox11_3" value="checkbox11_3" />
3</label>
<br />
<br />
Fråga 12:<br />
<label>
<input type="checkbox" name="checkbox12_0" value="checkbox12_0" />
0</label>
<label>
<input type="checkbox" name="checkbox12_1" value="checkbox12_1" />
1</label>
<label>
<input type="checkbox" name="checkbox12_2" value="checkbox12_2" />
2</label>
<label>
<input type="checkbox" name="checkbox12_3" value="checkbox12_3" />
3</label>
<br />
<br />
Fråga 13:<br />
<label>
<input type="checkbox" name="checkbox13_0" value="checkbox13_0" />
0</label>
<label>
<input type="checkbox" name="checkbox13_1" value="checkbox13_1" />
1</label>
<label>
<input type="checkbox" name="checkbox13_2" value="checkbox13_2" />
2</label>
<label>
<input type="checkbox" name="checkbox13_3" value="checkbox13_3" />
3</label>
<br /><br />
<label>Uträkning <br />
<input type="submit" name="Skicka" value="Uträkning" />
</label>
</form>
</P>
</body>
</html>
P Peter S Medlem sedan dec. 2002 5 483 inlägg Digital semla blir bra det :bire
function calc(f)
{
var cbprefix = "checkbox";
var elms = f.elements;
var total = 0;
for (var i = 0; i < 13; ++i){
var cb = cbprefix + (i+1) + "_";
for (var j = 0; j < 4; ++j){
if (elms[cb + j].checked){
total += parseInt(elms[cb + j].value);
}
}
}
if (total < 17){
total = "a";
alert("Ditt resultat blev " + total);
} else if (total < 30){
total = "b";
alert("Ditt resultat blev " + total);
} else {
total = "c";
alert("Ditt resultat blev " + total);
}
elms["total"].value = total;
}
richi_f Medlem sedan apr. 2004 206 inlägg Hej hej! Tack tack! Precis så vill jag ha det. Får dock inte upp någon ruta efter att jag klickat på knappen.
Ska det stå:
<form onsubmit="return total()">
eller
<form onsubmit="return calc(f)">
Har testat båda, ingen funkar...
Hur bakar man en digital semla? ;)
<form onsubmit="return calc(this)">
Men jag undra om du ska ha return .
P Peter S Medlem sedan dec. 2002 5 483 inlägg Return behövs inte i detta fall eftersom formuläret skall skickas oavsett (om jag förstått det rätt).
richi_f Medlem sedan apr. 2004 206 inlägg får inte till det...
Hej igen!
Nu får jag upp min ruta, tack! Dock är det inte riktigt rätt ändå.. för det blir samma resultat varje gång... c. Om inga boxar är ikryssade blir det a... hmmm
Skickar med hela koden här:
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script type="text/javascript">
function calc(f)
{
var cbprefix = "checkbox";
var elms = f.elements;
var total = 0;
for (var i = 0; i < 13; ++i){
var cb = cbprefix + (i+1) + "_";
for (var j = 0; j < 4; ++j){
if (elms[cb + j].checked){
total += parseInt(elms[cb + j].value);
}
}
}
if (total < 17){
total = "a";
alert("Ditt resultat blev under 17 " + total);
} else if (total < 30){
total = "b";
alert("Ditt resultat blev under 30 " + total);
} else {
total = "c";
alert("Ditt resultat blev över 30 " + total);
}
elms["total"].value = total;
}
</script>
</head>
<body>
<P>
<form onsubmit="calc(this)">
<label>Fråga 1:<br />
<input type="checkbox" name="checkbox1_0" value="checkbox1_0" />
0</label>
<label>
<input type="checkbox" name="checkbox1_1" value="checkbox1_1" />
1</label>
<label>
<input type="checkbox" name="checkbox1_2" value="checkbox1_2" />
2</label>
<label>
<input type="checkbox" name="checkbox1_3" value="checkbox1_3" />
3</label>
<br />
<br />
Fråga 2:<br />
<label>
<input type="checkbox" name="checkbox2_0" value="checkbo2_0x" />
0</label>
<label>
<input type="checkbox" name="checkbox2_1" value="checkbox2_1" />
1</label>
<label>
<input type="checkbox" name="checkbox2_2" value="checkbox2_2" />
2</label>
<label>
<input type="checkbox" name="checkbox2_3" value="checkbox2_3" />
3</label>
<br />
<br />
Fråga 3:<br />
<label>
<input type="checkbox" name="checkbox3_0" value="checkbox3_0" />
0</label>
<label>
<input type="checkbox" name="checkbox3_1" value="checkbox3_1" />
1</label>
<label>
<input type="checkbox" name="checkbox3_2" value="checkbox3_2" />
2</label>
<label>
<input type="checkbox" name="checkbox3_3" value="checkbox3_3" />
3</label>
<br />
<br />
Fråga 4:<br />
<label>
<input type="checkbox" name="checkbox4_0" value="checkbox4_0" />
0</label>
<label>
<input type="checkbox" name="checkbox4_1" value="checkbox4_1" />
1</label>
<label>
<input type="checkbox" name="checkbox4_2" value="checkbox4_2" />
2</label>
<label>
<input type="checkbox" name="checkbox4_3" value="checkbox4_3" />
3</label>
<br />
<br />
Fråga 5:<br />
<label>
<input type="checkbox" name="checkbox5_0" value="checkbox5_0" />
0</label>
<label>
<input type="checkbox" name="checkbox5_1" value="checkbox5_1" />
1</label>
<label>
<input type="checkbox" name="checkbox5_2" value="checkbox5_2" />
2</label>
<label>
<input type="checkbox" name="checkbox5_3" value="checkbox5_3" />
3</label>
<br />
<br />
Fråga 6:<br />
<label>
<input type="checkbox" name="checkbox6_0" value="checkbox6_0" />
0</label>
<label>
<input type="checkbox" name="checkbox6_1" value="checkbox6_1" />
1</label>
<label>
<input type="checkbox" name="checkbox6_2" value="checkbox6_2" />
2</label>
<label>
<input type="checkbox" name="checkbox6_3" value="checkbox6_3" />
3</label>
<br />
<br />
Fråga 7:<br />
<label>
<input type="checkbox" name="checkbox7_0" value="checkbox7_0" />
0</label>
<label>
<input type="checkbox" name="checkbox7_1" value="checkbox7_1" />
1</label>
<label>
<input type="checkbox" name="checkbox7_2" value="checkbox7_2" />
2</label>
<label>
<input type="checkbox" name="checkbox7_3" value="checkbox7_3" />
3</label>
<br />
<br />
Fråga 8:<br />
<label>
<input type="checkbox" name="checkbox8_0" value="checkbox8_0" />
0</label>
<label>
<input type="checkbox" name="checkbox8_1" value="checkbox8_1" />
1</label>
<label>
<input type="checkbox" name="checkbox8_2" value="checkbox8_2" />
2</label>
<label>
<input type="checkbox" name="checkbox8_3" value="checkbox8_3" />
3</label>
<br />
<br />
Fråga 9:<br />
<label>
<input type="checkbox" name="checkbox9_0" value="checkbox9_0" />
0</label>
<label>
<input type="checkbox" name="checkbox9_1" value="checkbox9_1" />
1</label>
<label>
<input type="checkbox" name="checkbox9_2" value="checkbox9_2" />
2</label>
<label>
<input type="checkbox" name="checkbox9_3" value="checkbox9_3" />
3</label>
<br />
<br />
Fråga 10:<br />
<label>
<input type="checkbox" name="checkbox10_0" value="checkbox10_0" />
0</label>
<label>
<input type="checkbox" name="checkbox10_1" value="checkbox10_1" />
1</label>
<label>
<input type="checkbox" name="checkbox10_2" value="checkbox10_2" />
2</label>
<label>
<input type="checkbox" name="checkbox10_3" value="checkbox10_3" />
3</label>
<br />
<br />
Fråga 11:<br />
<label>
<input type="checkbox" name="checkbox11_0" value="checkbox11_0" />
0</label>
<label>
<input type="checkbox" name="checkbox11_1" value="checkbox11_1" />
1</label>
<label>
<input type="checkbox" name="checkbox11_2" value="checkbox11_2" />
2</label>
<label>
<input type="checkbox" name="checkbox11_3" value="checkbox11_3" />
3</label>
<br />
<br />
Fråga 12:<br />
<label>
<input type="checkbox" name="checkbox12_0" value="checkbox12_0" />
0</label>
<label>
<input type="checkbox" name="checkbox12_1" value="checkbox12_1" />
1</label>
<label>
<input type="checkbox" name="checkbox12_2" value="checkbox12_2" />
2</label>
<label>
<input type="checkbox" name="checkbox12_3" value="checkbox12_3" />
3</label>
<br />
<br />
Fråga 13:<br />
<label>
<input type="checkbox" name="checkbox13_0" value="checkbox13_0" />
0</label>
<label>
<input type="checkbox" name="checkbox13_1" value="checkbox13_1" />
1</label>
<label>
<input type="checkbox" name="checkbox13_2" value="checkbox13_2" />
2</label>
<label>
<input type="checkbox" name="checkbox13_3" value="checkbox13_3" />
3</label>
<br /><br />
<label>Uträkning <br />
<input type="submit" name="Skicka" value="Uträkning" />
</label>
</form>
</P>
</body>
</html>
P Peter S Medlem sedan dec. 2002 5 483 inlägg Du har name = value på checkboxarna. Då finns ingenting att summera. Kika på mitt exempel längre upp när det gäller värden på value :)
richi_f Medlem sedan apr. 2004 206 inlägg Det var nästan för enkelt... nu funkar det! Tack så väldans mycket!
richi_f Medlem sedan apr. 2004 206 inlägg En liten extra fråga... ;)
Jo när jag fått upp skylten och klickat ok så skickas jag till startsidan på min hemsida, hur ska man skriva om man bara vill hänga kvar på samma sida.
Har testat med
<form onsubmit="calc(this)" action="http://sidan.com/default.asp?p=77 ">
som är sidan som formuläret ligger på men det funkar inte...
Nån idé?
Tack tack!
P Peter S Medlem sedan dec. 2002 5 483 inlägg Börja med att skriva onsubmit="return calc(this)"
I JavaScript-koden skriver du sedan return false direkt efter den alert() som körs då du vill stanna kvar på sidan.
Skriv till sist return true direkt innan den sista högermåsvingen i calc().
richi_f Medlem sedan apr. 2004 206 inlägg Det där fick jag inte till. Med detta inskrivet kommer inte skylten upp alls... det är säkert nåt enkelt fel jag gör. Den sista måsvingen är väl den sista i hela javascriptet? Alltså under elms["total"].value = total;
Sov gott! ;)
P Peter S Medlem sedan dec. 2002 5 483 inlägg Då skall vi se. Ändra onsubmit enligt mitt förra inlägg, sedan
function calc(f)
{
var cbprefix = "checkbox";
var elms = f.elements;
var total = 0;
for (var i = 0; i < 13; ++i){
var cb = cbprefix + (i+1) + "_";
for (var j = 0; j < 4; ++j){
if (elms[cb + j].checked){
total += parseInt(elms[cb + j].value);
}
}
}
if (total < 17){
total = "a";
alert("Ditt resultat blev under 17 " + total);
return false;
} else if (total < 30){
total = "b";
alert("Ditt resultat blev under 30 " + total);
} else {
total = "c";
alert("Ditt resultat blev över 30 " + total);
}
elms["total"].value = total;
return true;
}
...i ovanstående stannar man kvar på sidan om total < 17.
richi_f Medlem sedan apr. 2004 206 inlägg Hinner inte kika på det nu tyvärr, ska bort en vecka men tack så länge ;)
richi_f Medlem sedan apr. 2004 206 inlägg Hej hej! Tillbaka igen.. Skönt med lite semester.
Jo om jag istället för en alert skulle vilja skicka vidare till olika sidor beroende på resultatet. Alltså
Total = "a"; skicka vidare till sida1.asp
Total = "b"; skicka vidare till sida2.asp
Total = "c"; skicka vidare till sida3.asp
Hoppas ni förstår! Tack tack!
P Peter S Medlem sedan dec. 2002 5 483 inlägg Byt alert()-raderna mot location.href = "sidaX.asp";