2

Hi I tried to make a quiz for my friends. I set up function in my editor and it worked, when I move it to server, after button is hit nothing happens.

My html code is:

<div align="center"><img src="../obrazki/logo/logo4.jpg" class="logo"/></div>
<form  method="post" name="Formularz">
<strong>1. Question 1</strong><br>
<input  type="radio" name="a" value="5" />a) answer 1<br/>
<input  type="radio" name="a" value="3" />b) answer 2<br/>
<input  type="radio" name="a" value="1" />c) answer 3<br/>
<br/>
 .
 .
 .
<strong>15. Question 15</strong><br> 
<input  type="radio" name="b" value="5" />a) answer 1 <br/>
<input  type="radio" name="b" value="3" />b) answer 2<br/>
<input  type="radio" name="b" value="1" />c) answer 3<br/>
<br/>
</form>
<form method="post" name="formularz2" >
<strong>16. question16</strong><br> 
<input  type="radio" name="p" value="9" />a) answer 1<br/>
<input  type="radio" name="p" value="7" />b) answer 2<br/>
<input  type="radio" name="p" value="5" />c) answer 3<br/>
<input  type="radio" name="p" value="3" />d) answer 4<br/>
<input  type="radio" name="p" value="1" />e) answer 5<br/>
<br/>
.
.
.
<strong>20. Question 20</strong><br> 
<input  type="radio" name="w" value="9" />answer 1<br/>
<input  type="radio" name="w" value="7" />answer 2<br/>
<input  type="radio" name="w" value="5" />answer 3<br/>
<input  type="radio" name="w" value="3" />d) answer 4<br/>
<input  type="radio" name="w" value="1" />e) answer 5<br/>
<br/>
</form>
<button  type="button" onclick="checkRadio()">test</button>
<a  href="../index.htm"><p  align="center">Strona Główna</p></a>
<div id="suma"></div>
<div  id="suma2"></div>

My script looks like this:

<script type="text/javascript">
 function checkRadio() {
alert("hello World");
var form = document.getElementById('Formularz');
var form2 = document.getElementById('Formularz2');
var suma = 0;
var suma2= 0;
for ( var i=0; i<form.elements.length; i++)
if (form.elements[i].checked) {
        suma=suma+parseInt(form.elements[i].value);
        document.getElementById("suma").innerHTML = suma;
}
alert(suma);
for ( var i=0; i<form2.elements.length; i++)
if (form2.elements[i].checked) {
        suma2=suma2+parseInt(form2.elements[i].value);
        document.getElementById("suma2").innerHTML = suma2;
}
alert(suma2);
if (suma<9){
    if (suma2<20) {window.location="spider_bushi.htm"};
    else if (suma2<30) {window.location="spider_courtier.htm"};
    else {window.location="spider_shugenja.htm"}; 
}
 else if (suma<17){
    if (suma2<10) {window.location="scorpion_ninja.htm"};
    else if (suma2<20) {window.location="scorpion_bushi.htm"};
    else if (suma2<30) {window.location="scorpion_courtier.htm"};
    else {window.location="scorpion_shugenja.htm"};
}
else if (suma<26){
        if (suma2<20) {window.location="crab_bushi.htm"};
    else if (suma2<30) {window.location="crab_courtier.htm"};
    else if (suma2<40) {window.location="crab_shugenja.htm"};
    else {window.location="crab_monk.htm"}; 
}
else if (suma<34){
    if (suma2<15) {window.location="mantis_bushi.htm"};
    else if (suma2<30) {window.location="mantis_courtier.htm"};
    else {window.location="mantis_shugenja.htm"}; 
}
else if (suma<42){
    if (suma2<15) {window.location="unicron_bushi.htm"}; 
    else if (suma2<30) {window.location="unicron_courtier.htm"}; 
    else {window.location="unicron_shugenja.htm"}; 
}
else if (suma<51){
    if (suma2<20) {window.location="dragon_bushi.htm"}; 
    else if (suma2<30) {window.location="dragon_courtier.htm"};
    else if (suma2<40) {window.location="dragon_shugenja.htm"};
    else {window.location="dragon_monk.htm"}; 
}
else if (suma<60){
    if (suma2<20) {window.location="phoenix_bushi.htm"}; 
    else if (suma2<30) {window.location="phoenix_courtier.htm"}; 
    else if (suma2<40) {window.location="phoenix_shugenja.htm"}; 
    else {window.location="phoenix_monk.htm"}; 
}
    else if (suma<68){
    if (suma2<16) {window.location="crane_bushi.htm"}; 
    else if (suma2<31) {window.location="crane_courtier.htm"};
    else {window.location="crane_shugenja.htm"}; 
}
    else if (suma<76){
    if (suma2<16) {window.location="lion_bushi.htm"}; 
    else if (suma2<31) {window.location="lion_courtier.htm"};
    else {window.location="lion_shugenja.htm"};
}
else { alert("brak") }
} 
</script>

Scripts are working since putting a single "hello World" works when the page is loading. But button doesnt start checkRadio function at all, it doesnt even go to "hello world" line. Please help.

Dineshkani
  • 2,899
  • 7
  • 31
  • 43
Kazik
  • 705
  • 1
  • 8
  • 20

2 Answers2

1

There are few bugs in your code.

Firstly, you are using ; unnecessarily in if-else block.

if (suma2<20) {window.location="crab_bushi.htm"};
    else if (suma2<30) {window.location="crab_courtier.htm"};
    else if (suma2<40) {window.location="crab_shugenja.htm"};
    else {window.location="crab_monk.htm"}; 

The statement var form = document.getElementById('Formularz'); is wrong. As There is no form id called Formularz.

I have corrected these bugs.

HTML:

<div align="center"><img src="../obrazki/logo/logo4.jpg" class="logo"/></div>
<form  method="post" name="Formularz" id="Formularz">
<strong>1. Question 1</strong><br>
<input  type="radio" name="a" value="5" />a) answer 1<br/>
<input  type="radio" name="a" value="3" />b) answer 2<br/>
<input  type="radio" name="a" value="1" />c) answer 3<br/>
<br/>
 .
 .
 .
<strong>15. Question 15</strong><br> 
<input  type="radio" name="b" value="5" />a) answer 1 <br/>
<input  type="radio" name="b" value="3" />b) answer 2<br/>
<input  type="radio" name="b" value="1" />c) answer 3<br/>
<br/>
</form>
<form method="post" name="formularz2" id="formularz2" >
<strong>16. question16</strong><br> 
<input  type="radio" name="p" value="9" />a) answer 1<br/>
<input  type="radio" name="p" value="7" />b) answer 2<br/>
<input  type="radio" name="p" value="5" />c) answer 3<br/>
<input  type="radio" name="p" value="3" />d) answer 4<br/>
<input  type="radio" name="p" value="1" />e) answer 5<br/>
<br/>
.
.
.
<strong>20. Question 20</strong><br> 
<input  type="radio" name="w" value="9" />answer 1<br/>
<input  type="radio" name="w" value="7" />answer 2<br/>
<input  type="radio" name="w" value="5" />answer 3<br/>
<input  type="radio" name="w" value="3" />d) answer 4<br/>
<input  type="radio" name="w" value="1" />e) answer 5<br/>
<br/>
</form>
<button  type="button" onclick="checkRadio()">test</button>
<a  href="../index.htm"><p  align="center">Strona Główna</p></a>
<div id="suma"></div>
<div  id="suma2"></div>

JS:

function checkRadio() {
    alert("hello World");
    var form = document.getElementById('Formularz');
    var form2 = document.getElementById('Formularz2');
    var suma = 0;
    var suma2 = 0;
    for (var i = 0; i < form.elements.length; i++)
    if (form.elements[i].checked) {
        suma = suma + parseInt(form.elements[i].value,10);
        document.getElementById("suma").innerHTML = suma;
    }
    alert(suma);
    for ( i = 0; i < form2.elements.length; i++)
    if (form2.elements[i].checked) {
        suma2 = suma2 + parseInt(form2.elements[i].value,10);
        document.getElementById("suma2").innerHTML = suma2;
    }
    alert(suma2);
    if (suma < 9) {
        if (suma2 < 20) {
            window.location = "spider_bushi.htm";
        } else if (suma2 < 30) {
            window.location = "spider_courtier.htm";
        } else {
            window.location = "spider_shugenja.htm";
        }
    } else if (suma < 17) {
        if (suma2 < 10) {
            window.location = "scorpion_ninja.htm";
        } else if (suma2 < 20) {
            window.location = "scorpion_bushi.htm";
        } else if (suma2 < 30) {
            window.location = "scorpion_courtier.htm";
        } else {
            window.location = "scorpion_shugenja.htm";
        }
    } else if (suma < 26) {
        if (suma2 < 20) {
            window.location = "crab_bushi.htm";
        } else if (suma2 < 30) {
            window.location = "crab_courtier.htm";
        } else if (suma2 < 40) {
            window.location = "crab_shugenja.htm";
        } else {
            window.location = "crab_monk.htm";
        }
    } else if (suma < 34) {
        if (suma2 < 15) {
            window.location = "mantis_bushi.htm";
        } else if (suma2 < 30) {
            window.location = "mantis_courtier.htm";
        } else {
            window.location = "mantis_shugenja.htm";
        }
    } else if (suma < 42) {
        if (suma2 < 15) {
            window.location = "unicron_bushi.htm";
        } else if (suma2 < 30) {
            window.location = "unicron_courtier.htm";
        } else {
            window.location = "unicron_shugenja.htm";
        }
    } else if (suma < 51) {
        if (suma2 < 20) {
            window.location = "dragon_bushi.htm";
        } else if (suma2 < 30) {
            window.location = "dragon_courtier.htm";
        } else if (suma2 < 40) {
            window.location = "dragon_shugenja.htm";
        } else {
            window.location = "dragon_monk.htm";
        }
    } else if (suma < 60) {
        if (suma2 < 20) {
            window.location = "phoenix_bushi.htm";
        } else if (suma2 < 30) {
            window.location = "phoenix_courtier.htm";
        } else if (suma2 < 40) {
            window.location = "phoenix_shugenja.htm";
        } else {
            window.location = "phoenix_monk.htm";
        }
    } else if (suma < 68) {
        if (suma2 < 16) {
            window.location = "crane_bushi.htm";
        } else if (suma2 < 31) {
            window.location = "crane_courtier.htm";
        } else {
            window.location = "crane_shugenja.htm";
        }
    } else if (suma < 76) {
        if (suma2 < 16) {
            window.location = "lion_bushi.htm";
        } else if (suma2 < 31) {
            window.location = "lion_courtier.htm";
        } else {
            window.location = "lion_shugenja.htm";
        }
    } else {
        alert("brak");
    }
}

Even now the code won't work perfectly (as expected). The reason is You are using two forms in the same page. There are already lot of answers on handling multiple form at the same page at stack-overflow.

Suggestions For JavaScript Code Debugging:

Use Chrome debugger or Firebug for line by line JS Code Debugging . If the developer console is open, execution will break. It works in firebug as well.

Link

Also, you can always test your javascript code at JSFIDDLE. JS Fiddle is the best online IDE for javascript. It pin-point JS error and even displays the error msg.

Community
  • 1
  • 1
Ritesh Kumar Gupta
  • 5,055
  • 7
  • 45
  • 71
0

try below script you have put unwanted semicolons:

    function checkRadio() {
    alert("hello World");
    var form = document.getElementById('Formularz');
    var form2 = document.getElementById('Formularz2');
    var suma = 0;
    var suma2 = 0;
    for (var i = 0; i < form.elements.length; i++)
        if (form.elements[i].checked) {
            suma = suma + parseInt(form.elements[i].value);
            document.getElementById("suma").innerHTML = suma;
        }
    alert(suma);
    for (var i = 0; i < form2.elements.length; i++)
        if (form2.elements[i].checked) {
            suma2 = suma2 + parseInt(form2.elements[i].value);
            document.getElementById("suma2").innerHTML = suma2;
        }
    alert(suma2);
    if (suma < 9) {
        if (suma2 < 20) {
            window.location = "spider_bushi.htm"
        }

    else
        if (suma2 < 30) {
            window.location = "spider_courtier.htm"
        }

    else
        {
            window.location = "spider_shugenja.htm"
        }

    }
    else if (suma < 17) {
        if (suma2 < 10) {
            window.location = "scorpion_ninja.htm"
        }

    else
        if (suma2 < 20) {
            window.location = "scorpion_bushi.htm"
        }

    else
        if (suma2 < 30) {
            window.location = "scorpion_courtier.htm"
        }

    else
        {
            window.location = "scorpion_shugenja.htm"
        }

    }
    else if (suma < 26) {
        if (suma2 < 20) {
            window.location = "crab_bushi.htm"
        }

    else
        if (suma2 < 30) {
            window.location = "crab_courtier.htm"
        }

    else
        if (suma2 < 40) {
            window.location = "crab_shugenja.htm"
        }

    else
        {
            window.location = "crab_monk.htm"
        }

    }
    else if (suma < 34) {
        if (suma2 < 15) {
            window.location = "mantis_bushi.htm"
        }

    else
        if (suma2 < 30) {
            window.location = "mantis_courtier.htm"
        }

    else
        {
            window.location = "mantis_shugenja.htm"
        }

    }
    else if (suma < 42) {
        if (suma2 < 15) {
            window.location = "unicron_bushi.htm"
        }

    else
        if (suma2 < 30) {
            window.location = "unicron_courtier.htm"
        }

    else
        {
            window.location = "unicron_shugenja.htm"
        }

    }
    else if (suma < 51) {
        if (suma2 < 20) {
            window.location = "dragon_bushi.htm"
        }

    else
        if (suma2 < 30) {
            window.location = "dragon_courtier.htm"
        }

    else
        if (suma2 < 40) {
            window.location = "dragon_shugenja.htm"
        }

    else
        {
            window.location = "dragon_monk.htm"
        }

    }
    else if (suma < 60) {
        if (suma2 < 20) {
            window.location = "phoenix_bushi.htm"
        }

    else
        if (suma2 < 30) {
            window.location = "phoenix_courtier.htm"
        }

    else
        if (suma2 < 40) {
            window.location = "phoenix_shugenja.htm"
        }

    else
        {
            window.location = "phoenix_monk.htm"
        }

    }
    else if (suma < 68) {
        if (suma2 < 16) {
            window.location = "crane_bushi.htm"
        }

    else
        if (suma2 < 31) {
            window.location = "crane_courtier.htm"
        }

    else
        {
            window.location = "crane_shugenja.htm"
        }

    }
    else if (suma < 76) {
        if (suma2 < 16) {
            window.location = "lion_bushi.htm"
        }

    else
        if (suma2 < 31) {
            window.location = "lion_courtier.htm"
        }

    else
        {
            window.location = "lion_shugenja.htm"
        }

    }
    else {
        alert("brak")
    }
}

and html code:

    <div align="center"><img src="../obrazki/logo/logo4.jpg" class="logo"/></div>
<form method="post" name="Formularz" id="Formularz">
    <strong>1. Question 1</strong><br>
    <input type="radio" name="a" value="5"/>a) answer 1<br/>
    <input type="radio" name="a" value="3"/>b) answer 2<br/>
    <input type="radio" name="a" value="1"/>c) answer 3<br/>
    <br/>
    .
    .
    .
    <strong>15. Question 15</strong><br>
    <input type="radio" name="b" value="5"/>a) answer 1 <br/>
    <input type="radio" name="b" value="3"/>b) answer 2<br/>
    <input type="radio" name="b" value="1"/>c) answer 3<br/>
    <br/>
</form>
<form method="post" name="formularz2" id="Formularz2">
    <strong>16. question16</strong><br>
    <input type="radio" name="p" value="9"/>a) answer 1<br/>
    <input type="radio" name="p" value="7"/>b) answer 2<br/>
    <input type="radio" name="p" value="5"/>c) answer 3<br/>
    <input type="radio" name="p" value="3"/>d) answer 4<br/>
    <input type="radio" name="p" value="1"/>e) answer 5<br/>
    <br/>
    .
    .
    .
    <strong>20. Question 20</strong><br>
    <input type="radio" name="w" value="9"/>answer 1<br/>
    <input type="radio" name="w" value="7"/>answer 2<br/>
    <input type="radio" name="w" value="5"/>answer 3<br/>
    <input type="radio" name="w" value="3"/>d) answer 4<br/>
    <input type="radio" name="w" value="1"/>e) answer 5<br/>
    <br/>
</form>
<button type="button" onclick="checkRadio()">test</button>
<a href="../index.htm"><p align="center">Strona G?ówna</p></a>
<div id="suma"></div>
<div id="suma2"></div>
Vicky Gonsalves
  • 11,593
  • 2
  • 37
  • 58
  • "Hello World" pop up. But after this nothing happens. I`am new at this so I don`t know how to check it propertly on console here it the link http://l5k.cba.pl/Kim%20jestes%20w%20Rokuganie/ankieta.htm I tried with firebug but it say`s nothing. – Kazik Apr 22 '13 at 04:49
  • It worked, the problem was that there was "name" instead of "id". Thank You Very much :) – Kazik Apr 22 '13 at 04:56