...

View Full Version : Resolved Get Value Check It and Do Something Conditional



Majeste
09-13-2011, 10:32 AM
Hi,

I'm trying to create a test using Javascript. Actually, I did this in PHP, but we need to put it a server that does nor run it, I think I can convert it to Javascript. I hope it'll be work as in PHP somehow.

Test will be composed of 15 questions and each question has either "Yes" or "No" as answer. And, I use radio buttons here for answers. By the way, there will be more than one radio groups.

Now, I want to check the value of clicked radio button in each group and use an if-statement to determine if it's correct. And, if it's correct, I want to increment a variable by 1.

Finally, by the resulted variable incremented for each question in the test, I want to use another if-statement to show specific result message for and interval of that variable.

I tried this for one radio button like this:



<script language="JavaScript">

function get(form) {

var ans1 = document.form.q1;
var score = 0;

for( i = 0; i < ans1.length; i++ )
{
if( ans1[i].checked && ans1[i].value == no )
{
score++;
alert(score);
}

else
{alert(score);}

break;
}
}

</script>

<form name="form" method="get">

<input type="radio" name="q1" value="yes">Yes
<input type="radio" name="q1" value="no">No*

<input type="button" name="button" value="button" onclick="get(this.form)" />
</form>


By the code above, it should alert 1 if "No" is checked and button is clicked and alert 0 if "Yes". This was a preliminary job for me to understand. And I couldn't do even this.

Thank you.

vwphillips
09-13-2011, 10:47 AM
<!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" xml:lang="en" lang="en">

<head>
<title></title>
</head>

<body>
<script type="text/javascript">

function get(form) {

var ans1 = form.q1;
var score = 0;
for( i = 0; i < ans1.length; i++ )
{
if( ans1[i].checked && ans1[i].value == 'no' )
{
score++;
break;
}


}
alert(score);
}

</script>

<form name="form" method="get">

<input type="radio" name="q1" value="yes">Yes
<input type="radio" name="q1" value="no">No*

<input type="button" name="button" value="button" onclick="get(this.form)" />
</form>
</body>

</html>

also


<!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" xml:lang="en" lang="en">

<head>
<title></title>
</head>

<body>
<script type="text/javascript">

function get(form) {

var score = 0;
if( form.q1[1].checked)
{
score++;
}
alert(score);
}

</script>

<form name="form" method="get">

<input type="radio" name="q1" value="yes">Yes
<input type="radio" name="q1" value="no">No*

<input type="button" name="button" value="button" onclick="get(this.form)" />
</form>
</body>

</html>

Majeste
09-13-2011, 10:59 AM
Thank you. :) I got the second one, it worked. :)

I can calculate and alert the score now.

But, how do I show a message. I just used "document.write" and it didn't work with multiple lines. I was doing it with echo like this. I need to put HTML tags into, as well.


if ( 0 <= $score && $score <= 5 )
{
echo "
<h1>Result</h1>
<p>Your score is " . $score . ".</p>
<p>You are the worst in the lab working. You should read and apply safety rules immediately or you should have emergency phone numbers in your pocket.</p>
<p><a href=\"http://2011.igem.org/Team:METU-Ankara/Safety\" target=\"_blank\">Read Safety Rules</a></p>
<p><a href=\"javascript:history.go(-1)\">Back to Test</a></p>
";
}

vwphillips
09-13-2011, 12:40 PM
<!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" xml:lang="en" lang="en">

<head>
<title></title>
<style type="text/css">
/*<![CDATA[*/

#message {
width:300px;
}

/*]]>*/
</style></head>

<body>
<script type="text/javascript">

function get(form,obj) {
var score = 0,mes,obj=document.getElementById(obj);;
if( form.q1[1].checked){
score++;
}
if (obj){
obj.innerHTML='';
if (score>0 && score <= 5 ) {
mess='<h1>Result</h1><p>Your score is ' +score+'.</p>';
mess+='<p>You are the worst in the lab working. You should read and apply safety rules immediately or you should have emergency phone numbers in your pocket.</p>'
mess+='<p><a href=\"http://2011.igem.org/Team:METU-Ankara/Safety\" target=\"_blank\">Read Safety Rules</a></p>'
mess+='<a href=\"javascript:history.go(-1)\">Back to Test</a></p>';
obj.innerHTML=mess;
}
}
}

</script>

<form name="form" method="get">

<input type="radio" name="q1" value="yes">Yes
<input type="radio" name="q1" value="no">No*

<input type="button" name="button" value="button" onclick="get(this.form,'message')" />
<div id="message" ></div>
</form>
</body>

</html>

Majeste
09-13-2011, 03:53 PM
Oh, I see. We use innerHTML here. Thanks a lot my friend.

It's done and does exactly what I want. :)



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum