PHP/Javascript Guessing Game

Random number guessing game

Page 1 of 1

14 Replies - 4296 Views - Last Post: 12 November 2010 - 07:23 AM Rate Topic: -----

#1 nikc121  Icon User is offline

  • D.I.C Head

Reputation: 2
  • View blog
  • Posts: 133
  • Joined: 12-April 10

PHP/Javascript Guessing Game

Posted 08 November 2010 - 12:33 PM

I know this should be simple, but I just cant get it to work. I need to generate a code with html asking the user to guess a number from 1-5. After the user types in the guess and hits submit, it calls the PHP and shows Correct, Too High, Too Low, I am also to use Javascript to validate the input (but thats extra) I cannot use Java or mysqul, havnt learned it yet. :) And it has to validate strict. My code currently allows the user to imput a number and when Guess is pressed it always comes back with TOO High guess again. Please Help. Here is the HTML
<title>Guess A Number</title>

<script type="text/javascript" src="./styles/guess.js"></script>
<link href= "./styles/guessinggame.css" rel= "stylesheet" type= "text/css" />
</head>
<body>
<p>
    <a href= "index.html">Home</a>
</p>
<h1>Guess a Number from 1-5</h1>
<p>
</p>

<form method="post" action="http://nova.umuc.edu/cgi-bin/cgiwrap/~ct386b11/answer.php">

<input type = "hidden"
name = "number"
value = "$number">
<input type = "hidden"
name = "counter"
value = "$counter">
<input type = "text"
name = "guess"
value = "">
<input type="submit"
value="Guess">
</form>
</body>
</html>

Here is my PHP code
<?php
global $number;
global $guess;
global $counter;
$guess=$_REQUEST["guess"];
$counter=$_REQUEST["counter"];
$number=$_REQUEST["number"]; 
 
if(empty($number)){
	print "<h4>Welcome! I have a number between 1 and 5. Please guess it.<h4>\n";
	$number=rand(1,5);
	$counter=0;
} else {
	if($number==$guess){
	$counter++;
	print "<h4>Well done! You guessed $number in $counter steps.<h4>\n";
 
	}
	if($guess<$number){
	$counter++;
	print "<h4>Too low. Guess a higher number<h4>\n";
	}
	if($guess>$number){
	$counter++;
	print "<h4>Too high. Guess a lower number<h4>\n";
	}
}

?>


Is This A Good Question/Topic? 0
  • +

Replies To: PHP/Javascript Guessing Game

#2 BenignDesign  Icon User is offline

  • holy shitin shishkebobs
  • member icon




Reputation: 6005
  • View blog
  • Posts: 10,425
  • Joined: 28-September 07

Re: PHP/Javascript Guessing Game

Posted 08 November 2010 - 02:05 PM

Just a quick glance at it, but your PHP else statement contains three more if's with no else's.... which indicates to me that no matter what the user enters, it cycles through all three options and displays the last one regardless of which one it is.

Try changing the order of those three if statements. See if the one on the bottom is the one that's displayed.

This post has been edited by BenignDesign: 08 November 2010 - 02:11 PM

Was This Post Helpful? 1
  • +
  • -

#3 nikc121  Icon User is offline

  • D.I.C Head

Reputation: 2
  • View blog
  • Posts: 133
  • Joined: 12-April 10

Re: PHP/Javascript Guessing Game

Posted 08 November 2010 - 05:41 PM

View PostBenignDesign, on 08 November 2010 - 01:05 PM, said:

Just a quick glance at it, but your PHP else statement contains three more if's with no else's.... which indicates to me that no matter what the user enters, it cycles through all three options and displays the last one regardless of which one it is.

Try changing the order of those three if statements. See if the one on the bottom is the one that's displayed.

Thanks, I saw that after I posted it.. Cant believe I missed that, but even after I fixed it, im getting some serious build errors and other run problems, so for now I have deleted the entire code and trying to come up with something else (little more simple) If you have any ideas that would be great. Ill post what I come up with later on this same thread.
Was This Post Helpful? 0
  • +
  • -

#4 nikc121  Icon User is offline

  • D.I.C Head

Reputation: 2
  • View blog
  • Posts: 133
  • Joined: 12-April 10

Re: PHP/Javascript Guessing Game

Posted 08 November 2010 - 06:10 PM

Ok so a wrote it somewhat different, and just when I thought I hade it..UGGGGG. When you hit submit it always says YOU GOT IT, even if I input a number higher than five...Any eyes out there that can obviously see what I can not....Thanks, for any help.
HTML CODE
<h1>Guess a Number from 1-5</h1>
<p>
</p>

<form method="post" action="http://nova.umuc.edu/cgi-bin/cgiwrap/~ct386b11/answer.php">

<p>Number:
    <input name="input" type="text">
</p>
  <p>
    <input type="hidden" name="number" value="<? echo "$number" ?>
</p>
  <p>      <input name="" type="submit">
    </p>
</form>

PHP CODE
<?php
$input = $_POST['number'];    
if (isset($_POST['input'])) 
{ 
if ($input < $number) 
{          
echo "Guess Higher";
} elseif ($input > $number)
 {          
echo "Guess Lower";
} elseif ($input == $number) 
{          
echo "You got it!";
}
} else {
$number = rand(1,5);     
}
?>

Was This Post Helpful? 0
  • +
  • -

#5 macosxnerd101  Icon User is online

  • Self-Trained Economist
  • member icon




Reputation: 10438
  • View blog
  • Posts: 38,656
  • Joined: 27-December 08

Re: PHP/Javascript Guessing Game

Posted 08 November 2010 - 06:51 PM

Looking at your HTML form, it could have something to do with the invalid syntax here. Notice the highlighting how $number is black, but the echo part is blue. This is because the opening double-quote in front of number ends the assignment for the value attribute. Also, don't forget the semi-colon at the end of the echo statement.
 <input type="hidden" name="number" value="<? echo "$number" ?> 



So probably better:
 <input type="hidden" name="number" value="<? echo $number; ?>" > <!-- notice the end to the tag as well -->


Was This Post Helpful? 2
  • +
  • -

#6 kinggeorge1987  Icon User is offline

  • D.I.C Head
  • member icon

Reputation: 12
  • View blog
  • Posts: 130
  • Joined: 22-September 10

Re: PHP/Javascript Guessing Game

Posted 08 November 2010 - 06:52 PM

View Postnikc121, on 08 November 2010 - 05:10 PM, said:

Ok so a wrote it somewhat different, and just when I thought I hade it..UGGGGG. When you hit submit it always says YOU GOT IT, even if I input a number higher than five...Any eyes out there that can obviously see what I can not....Thanks, for any help.
HTML CODE
<h1>Guess a Number from 1-5</h1>
<p>
</p>

<form method="post" action="http://nova.umuc.edu/cgi-bin/cgiwrap/~ct386b11/answer.php">

<p>Number:
    <input name="input" type="text">
</p>
  <p>
    <input type="hidden" name="number" value="<? echo "$number" ?>
</p>


You should change
<input name="input" type="text">
to
<input name="input" type="text" name="number">
. Even if the text field was correctly named "number" you couldn't echo the value to the hidden field unless the form was posted to the same page and you used the $_GET method.

At this point the variable $number doesn't exist. You should take
<input type="hidden" name="number" value="<? echo "$number" ?>
out and change the text fields name to "number" as explained above.

Quote

  <p>      <input name="" type="submit">
    </p>
</form>


Give your submit button a name, it's just good practice.

PHP CODE
<?php
$input = $_POST['number'];    
if (isset($_POST['input'])) 
{ 
if ($input < $number) 
{          
echo "Guess Higher";
} elseif ($input > $number)
 {          
echo "Guess Lower";
} elseif ($input == $number) 
{          
echo "You got it!";
}
} else {
$number = rand(1,5);     
}
?>

Besides that code seeming to be a mess, you dont establish the $number variable until after all the checks are done. Try something like this:

<?php
$input = $_POST['number'];
$number=rand(1,5);
echo $number; // For debugging purposes
	if($input){
		if($input < $number){
			echo "Too low";
			exit; // Or what you want to happen.
		}
			if($input > $number){
			   echo "Too high";
			   exit; //Or what you want to happpen.
			   }
			   
			   if($input == $number){
				   echo "You got it";
				   exit; //Or what you want to happen.
			   }
	}
	?>



And make these changes to your HTML form.
	<form method="post" action="http://nova.umuc.edu/cgi-bin/cgiwrap/~ct386b11/answer.php">
	 
	<p>Number:
	    <input name="number" type="text">
	</p>
	  <p>      <input name="submit" type="submit">
	    </p>
	</form>


This post has been edited by kinggeorge1987: 08 November 2010 - 06:53 PM

Was This Post Helpful? 3
  • +
  • -

#7 nikc121  Icon User is offline

  • D.I.C Head

Reputation: 2
  • View blog
  • Posts: 133
  • Joined: 12-April 10

Re: PHP/Javascript Guessing Game

Posted 08 November 2010 - 08:13 PM

Ok, I made the changes and now I get no response. I know you guys dont like helping too much with homework, but as you can see I have been trying, and its do tonight before midnight,,,,Please Help
HTML CODE
<h1>Guess a Number from 1-5</h1>
<p>
</p>

<form method="post" 

action="http://nova.umuc.edu/cgi-bin/cgiwrap/~ct386b11/answer.php">

<p>Your Guess:
<input name="number" type ="text">
</p>
<p>
<input name= "submit" type ="submit">
</p>
</form>

>PHP CODE
php
$input = $_POST["number"];
$number = rand(1,5);     
if (isset($_POST["input"])) { 
if ($input < $number) {          
echo "Guess Higher";
} elseif ($input > $number) {          
echo "Guess Lower";
} elseif ($input == $number) {          
echo "You got it!";
}
} else {
    
}
?>

Was This Post Helpful? 0
  • +
  • -

#8 kinggeorge1987  Icon User is offline

  • D.I.C Head
  • member icon

Reputation: 12
  • View blog
  • Posts: 130
  • Joined: 22-September 10

Re: PHP/Javascript Guessing Game

Posted 08 November 2010 - 09:26 PM

Sorry, had a typo in there. Insert value="" into your <input> tag. Your not passing the value over into post,because there is no value to passed.r
Was This Post Helpful? 0
  • +
  • -

#9 macosxnerd101  Icon User is online

  • Self-Trained Economist
  • member icon




Reputation: 10438
  • View blog
  • Posts: 38,656
  • Joined: 27-December 08

Re: PHP/Javascript Guessing Game

Posted 08 November 2010 - 09:30 PM

Also, please properly indent your PHP to make it easier to follow the logic. :)
Was This Post Helpful? 1
  • +
  • -

#10 nikc121  Icon User is offline

  • D.I.C Head

Reputation: 2
  • View blog
  • Posts: 133
  • Joined: 12-April 10

Re: PHP/Javascript Guessing Game

Posted 10 November 2010 - 07:29 PM

OK,so my guessinggame.html file works great along with my answer.php file I will post it for future students that need help.But my problem is when I try to add style to my anwers.php file. Nothing happens. Here is my path
<Handson folder>
gussinggame.html
<style folder>
guessinggame.css
<image folder>
megamids2.jpg
<cgi-bin Folder>
answer.php
For some reason when I link my gueesinggame.css to my answer.php file ,nothing happens. Please look and show me what I am missing. Thanks.
Gussinggame.html code
<head>

<title>Guess A Number</title>

<script type="text/javascript" src="./styles/guess.js"></script>
<link href= "./styles/guessinggame.css" rel= "stylesheet" type= "text/css" />


</head>

<body>

<p>
    <a href= "index.html">Home</a>
</p>
<h1>Guess a Number from 1-5</h1>

<form method="post" action="http://nova.umuc.edu/cgi-bin/cgiwrap/~ct386b11/answer.php">
<div id="label">
<input name="number" type="text" class="input" />
</div>
<p id = "buttons">
<input type ="submit" name ="submit" class="frmbutton" value ="Submit" />
<input type ="reset"  name="reset" class="frmbutton" value ="Reset" />
</p>
</form>
<p>
<img class ="img" id="megamind" src="./images/megamind2.jpg" alt="Megamind" />
</p>
<p>
<a href ="http://www.3ddigitalwallpapers.com">Images Provided By:</a>
</p>
</body>
 <p>
    <a href="http://validator.w3.org/check?uri=referer"><img
        src="http://www.w3.org/Icons/valid-xhtml10"
        alt="Valid XHTML 1.0 Strict" height="31" width="88" /></a>
  </p>
<p>
    <a href="http://jigsaw.w3.org/css-validator/check/referer">
        <img style="border:0;width:88px;height:31px"
            src="http://jigsaw.w3.org/css-validator/images/vcss"
            alt="Valid CSS!" />
    </a>
</p>
</html>

This is my guessingame.css code
h1	{font-family: monotype corsiva; color: #ff00ff; text-align: center;font-size: 4em;}
body	{background-color: #00ffff;}
.img 	{position: absolute; left:250px;}

a:link 	{color: #3D0000;}
a:hover	{background-color:#ffff00; color: #D68533; text-decoration: none;}
a:active	{color: #660000;}

#buttons {text-align:center;}
#label	{text-align: center;}
.input {
    border: 1px solid #ff00ff;
    background: #ffc;
}
.input:hover {
    border: 1px solid #f00;
    background: #ffff00;
}

.frmbutton	{cursor:pointer;
border:outset 1px #ff00ff;
background-color :#ffff00;
color:#0000ff;
font-weight:bold;
padding: 1px 2px;
background:url(media/formbg.gif) repeat-x left top;
}


This is my answer.php
<head>

<title>Your Guess Was</title>

<link rel="stylesheet" type="text/css" href="http://nova.umuc.edu/~ct386b11/handson/guessinggame.css" />
</head>
<body>
<?php
$input = $_POST["number"];
$number = rand(1,5);
echo"Your Guess Was\n";
echo "$number\n";
{ 
if($input < $number){
echo"Too low\n";
}
if($input > $number){
echo"Too high\n";
}
if($input == $number){
echo"You got it\n";
} 
} 
?>
<p>
</p>
<ul>
<li>
<a href="http://nova.umuc.edu/~ct386b11/handson/index.html">Home</a>
<a href="http://nova.umuc.edu/~ct386b11/handson/guessinggame.html">Try Again</a>
</li></ul>
<p>
</p>
<p>
<img class ="img" id="megamind" src="http://nova.umuc.edu/~ct386b11/handson/images/megamind2.jpeg"
alt="Megamind" />
</p>
</body>
</html>

Im just trying to add my guessinggame.css to my answer.php to make the text,image, and background color to appear.
Was This Post Helpful? 0
  • +
  • -

#11 nikc121  Icon User is offline

  • D.I.C Head

Reputation: 2
  • View blog
  • Posts: 133
  • Joined: 12-April 10

Re: PHP/Javascript Guessing Game

Posted 10 November 2010 - 08:52 PM

ok, so I got my image to display, silly me forgot to add the styles folder,
<link rel="stylesheet" type="text/css" 

href="http://nova.umuc.edu/~ct386b11/handson/styles/guessinggame.css" />
But The response "your guess was # Too high, or too low or correct, I am trying to get it to display center and font-family: monotype corsiva; color: #ff00ff; text-align: center;font-size: 4em, but nothing seems to work, PLEASE HELP
Was This Post Helpful? 0
  • +
  • -

#12 BenignDesign  Icon User is offline

  • holy shitin shishkebobs
  • member icon




Reputation: 6005
  • View blog
  • Posts: 10,425
  • Joined: 28-September 07

Re: PHP/Javascript Guessing Game

Posted 11 November 2010 - 07:59 AM

Have you tried puting a div or span class around the responses and styling the class?


echo "<span class='response'>Too high</span>";




and in your CSS


span.response{font-family: monotype corsiva; color: #ff00ff; text-align: center;font-size: 4em}



Was This Post Helpful? 0
  • +
  • -

#13 nikc121  Icon User is offline

  • D.I.C Head

Reputation: 2
  • View blog
  • Posts: 133
  • Joined: 12-April 10

Re: PHP/Javascript Guessing Game

Posted 11 November 2010 - 02:26 PM

View PostBenignDesign, on 11 November 2010 - 06:59 AM, said:

Have you tried puting a div or span class around the responses and styling the class?


echo "<span class='response'>Too high</span>";




and in your CSS


span.response{font-family: monotype corsiva; color: #ff00ff; text-align: center;font-size: 4em}



Thanks everything works great. I just wrapped my comments in <h2>. Thanks everyone for your help. Im posting a new help topic today, so look for me....LOL
Was This Post Helpful? 0
  • +
  • -

#14 Charles_KnNell  Icon User is offline

  • New D.I.C Head

Reputation: 1
  • View blog
  • Posts: 17
  • Joined: 20-December 09

Re: PHP/Javascript Guessing Game

Posted 11 November 2010 - 02:39 PM

View Postnikc121, on 11 November 2010 - 01:26 PM, said:

View PostBenignDesign, on 11 November 2010 - 06:59 AM, said:

Have you tried puting a div or span class around the responses and styling the class?


echo "<span class='response'>Too high</span>";




and in your CSS


span.response{font-family: monotype corsiva; color: #ff00ff; text-align: center;font-size: 4em}



Thanks everything works great. I just wrapped my comments in <h2>. Thanks everyone for your help. Im posting a new help topic today, so look for me....LOL


I'd love to see your final code, if you wouldn't mind sharing that.

This post has been edited by Charles_KnNell: 11 November 2010 - 02:44 PM

Was This Post Helpful? 0
  • +
  • -

#15 nikc121  Icon User is offline

  • D.I.C Head

Reputation: 2
  • View blog
  • Posts: 133
  • Joined: 12-April 10

Re: PHP/Javascript Guessing Game

Posted 12 November 2010 - 07:23 AM

Sure No Problem, NOW how do I mark this thread solved?HTML CODE
<head>

<title>Guess A Number</title>

<script type="text/javascript" src="./styles/guess.js"></script>
<link href= "./styles/guessinggame.css" rel= "stylesheet" type= "text/css" />
</head>
<body>
<p>
    <a href= "index.html">Home</a>
</p>
<h1>Guess a Number from 1-5</h1>

<form method="post" action="http://nova.umuc.edu/cgi-bin/cgiwrap/~ct386b##/answer.php">
<div id="label">
<input name="number" type="text" class="input" />
</div>
<p id = "buttons">
<input type ="submit" name ="submit" class="frmbutton" value ="Submit" />
<input type ="reset"  name="reset" class="frmbutton" value ="Reset" />
</p>
</form>
<p>
<img class ="img" id="megamind" src="./images/megamind2.jpg" alt="Megamind" />
</p>
<p>
<a href ="http://www.3ddigitalwallpapers.com">Images Provided By:</a>
</p>
</body>
 <p>
    <a href="http://validator.w3.org/check?uri=referer"><img
        src="http://www.w3.org/Icons/valid-xhtml10"
        alt="Valid XHTML 1.0 Strict" height="31" width="88" /></a>
  </p>
<p>
    <a href="http://jigsaw.w3.org/css-validator/check/referer">
        <img style="border:0;width:88px;height:31px"
            src="http://jigsaw.w3.org/css-validator/images/vcss"
            alt="Valid CSS!" />
    </a>
</p>

</html>

PHP CODE
<head>

<title>Your Guess Was</title>

<link rel="stylesheet" type="text/css" href="http://nova.umuc.edu/~ct386b##/handson/styles/guessinggame.css" />

</head>
<body>
<p>
<a href="http://nova.umuc.edu/~ct386b##/handson/index.html">Home</a>
<a href="http://nova.umuc.edu/~ct386b##/handson/guessinggame.html">Try Again</a>
</p>
<h1>Do YOU HAVE A MEGA MIND?</h1>
<?php
$input = $_POST["number"];
$number = rand(1,5);
echo"<h2>Your Guess Was</h2>\n";
echo "<h3>$number</h3>\n";
{ 
if($input < $number){
echo"<h2>Too low, You do NOT have a Mega Mind</h2>\n";
}
if($input > $number){
echo"<h2>Too high, you do NOT have a Mega Mind</h2>\n";
}
if($input == $number){
echo"<h2>You have a Mega Mind</h2>\n";
} 
} 

?>
CSS CODE
h1	{font-family: monotype corsiva; color: #ff00ff; text-align: center;font-size: 3em;}
h2,h3	{font-family: monotype corsiva; color: #ff00ff; text-align: center;}
body	{background-color: #00ffff;}
.img 	{position: absolute; left:250px;}

a:link 	{color: #3D0000;}
a:hover	{background-color:#ffff00; color: #D68533; text-decoration: none;}
a:active	{color: #660000;}

#buttons {text-align:center;}
#label	{text-align: center;}
.input {
    border: 1px solid #ff00ff;
    background: #ffc;
}
.input:hover {
    border: 1px solid #f00;
    background: #ffff00;
}

.frmbutton	{cursor:pointer;
border:outset 1px #ff00ff;
background-color :#ffff00;
color:#0000ff;
font-weight:bold;
padding: 1px 2px;
background:url(media/formbg.gif) repeat-x left top;
}

Was This Post Helpful? 0
  • +
  • -

Page 1 of 1