I am making a questionaire for my school project.
I have a "fill-out-form" which is a place for people to fill their data such as name, age, etc.
Then, I have "questionaire form" named "music.html" and "math.html".
If music.html has been answered, then it will go to math.html .
If both of the questionaire forms have been answered, it will show the result like:
Name : John
Age : 20
Music score : 5
Math score : 2
At last, it will store the data (name, age, music score and math score) to database MySql.
How can I do this? Thanks in advance.
Fillform.html
<html>
<head
</head>
<form name="myform" method="post" action="music.html">
Username : <input name="username" type="text"> <br>
Age : <input name="age" type="text"> <br>
<input name="Button" type="button" value="SUBMIT">
</body>
</html>
Here's music.html looks like:
<html>
<head>
<script type="text/javascript" src="../js/script.js"></script>
<form name="myform" method="post"
önSubmit="return validateRadio()" action="math.html">
<table class="tftable" border="1">
<tr><th><div align="center" class="tftable th">Questions</div></th><th colspan="2"><div align="center">Answer</div></th>
</tr>
<tr>
<td>I like to dance</td>
<td>
<label>
<input name="bm1" type="radio" value="1" />
Yes</label>
</td>
<td>
<label>
<input name="bm1" type="radio" value="2" />
No
</label>
</td>
</tr>
<tr>
<td>I like to play sports such as baseball, soccer, hockey, or football </td>
<td>
<label>
<input name="bm2" type="radio" value="1" />
Yes</label>
</td>
<td>
<label>
<input name="bm2" type="radio" value="2" />
No </label>
</td>
</tr></table>
My math.html looks same like this just different on the questions.
I have put javascript to count how many "yes" answer are there. If there're 4 yes then
music score : 4
I have put javascript to count the "yes" answer
script.js
function validateRadio()
{
var inputs = myform.elements;
var radios = [];
for (var i = 0; i < inputs.length; ++i) {
if (inputs[i].type == 'radio') {
radios.push(inputs[i]);
}
}
var countChecked = 0;
for (var j = 0; j < radios.length; j++) {
if (radios[j].checked) {
countChecked++;
}
}
var answeramount = 0;
for (var k = 0; k < radios.length; k++){
if(radios[k].checked && radios[k].value==1){
answeramount++;
}
}
if (countChecked != radios.length / 2){
alert("All questions must be answered.");
return false;
} else {
alert(answeramount);
return true;
}
}