• 0

PHP, JQUERY Tic Tac Toe


Question

23 answers to this question

Recommended Posts

  • 0

Er, you wouldn't need php or jquery for that, you could write it all in javascript, unless you had some desire to log win/loss results. Hell, you could even do that for one player locally.

 

Figure out how to store the data (hint: arrays), then figure out the test cases. It's not hard, since there's no such thing as winning in tic-tac-toe, only not losing.

  • 0

So is this a game of Tic Tac Toe played over the Internet between two computers?

I guess you'd need to POST the moves of Player 1 using AJAX to a PHP script (adding this to a DB), then Player 2's browser would be polling the server using another PHP script (querying the DB) and an AJAX GET request to update the game on their end, and vice-versa?

  • 0
  On 25/07/2013 at 05:46, xScence said:

Well when i click somewhere AI to click too after my move. Me click -> AI click -> Me Click -> AI click and so on till some one wins or its ties. I just need some logic and examples thats all.

ok well personally I would store all the moves in a PHP array ..but as for the "AI" ...its a loose term its actually simulated AI ....it gives the impression of intelligence and while you may or may have not known that is irrelevant what you have to remember is not matter what... you are going to have to program all its moves.. whether you right a mathmatical algorithm or if you simply write a database full of possible outcomes 

 

I would have to sit down and think about it but personal I would go with a lengthy algo ...you can write a list of functions but the main thing you need to do is make it play one move ahead then return the previous step. its hard to explain but not hard to program lol

  • 0
  On 25/07/2013 at 14:21, xScence said:

i don't know how i can make the clicks. Which is better to have 9 divs and when to click them to send some ajax or buttons ?

its what ever you are more comfortable with coding ? with this there is no standard and with code there normally is not just one way... do the way you think you can or atleast prefer the sounds of.... or ...do both ? either way you are going to have to link to ajax for real time :L 

  • 0

Sounds quite a fun piece of homework haha.

 

How about doing a simple 3x3 table, with numerical id's. Use JQuery to add an event listener to look out for a click of a TD, grab the ID of the table and change the background image of that to one of the symbols. Once that's done, call an AI function which looks out for which images are in the grid, and where it could make a line using the numerical ID's?

 

If you need that logic doing in PHP, store the results in a DB once called to make a move and do the logic that way. Or, if you want something simple. just fire off the state of the full table every move so you can work out the AI's move without needed a DB.

  • 0
<table>
	<tr>
		<td id='1-1'></td>
		<td id='1-2'></td>
		<td id='1-3'></td>
	</tr>
	<tr>
		<td id='2-1'></td>
		<td id='2-2'></td>
		<td id='2-3'></td>
	</tr>
	<tr>
		<td id='3-1'></td>
		<td id='3-2'></td>
		<td id='3-3'></td>
	</tr>
</table>
$('td').click(function(e) {
	makeMove(e.target.id);
});

function makeMove(square) {
	$.ajax("?square="+square function(data){
		//Set table background
		aiMove();
	});
}

function aiMove() {
	//AI Calculations
	//AJAX or 
}

That's very simple, but does that help? Just don't want to do your homework for you ;)

  • 0

Seems kinda pointless involving PHP to be honest, makes much more sense for it all to be done in the browser (unless you want to add multi-player (node would be better here) or just save scores server side).

 

Only reason i can see to involve php would be if its some badly spec'ed out homework "/

  • 0
  On 25/07/2013 at 14:39, Bag said:

Seems kinda pointless involving PHP to be honest, makes much more sense for it all to be done in the browser (unless you want to add multi-player (node would be better here) or just save scores server side).

 

Only reason i can see to involve php would be if its some badly spec'ed out homework "/

If its homework, may just be to show how to hide game logic from the user so it isn't exploited as easily. Harder to force the AI to let you win if you don't have direct access to it the way you would with JavaScript. Just a guess though.

  • 0

I got this:

 

<script>
$(document).ready(function(){


$('td').click(function(e) {
makeMove(e.target.id);
});


function makeMove(square){
$.ajax({
type: "POST",
url: "tictactoeAjax.php",
data: 'test=' + square,
success: function(data){
alert(data);
}
});
}
});


</script>


<table border="1" width="300" height="300" id="tictactoe" name="table">
<tr>
<td align="center" id='0'></td>
<td align="center" id='1'></td>
<td align="center" id='2'></td>
</tr>
<tr>
<td align="center" id='3'></td>
<td align="center" id='4'></td>
<td align="center" id='5'></td>
</tr>
<tr>
<td align="center" id='6'></td>
<td align="center" id='7'></td>
<td align="center" id='8'></td>
</tr>
</table>

But how can i set X and O backgrounds?, thanks.
  • 0
  On 25/07/2013 at 20:24, xScence said:

 

I got this:

 

<script>
$(document).ready(function(){


$('td').click(function(e) {
makeMove(e.target.id);
});


function makeMove(square){
$.ajax({
type: "POST",
url: "tictactoeAjax.php",
data: 'test=' + square,
success: function(data){
alert(data);
}
});
}
});


</script>


<table border="1" width="300" height="300" id="tictactoe" name="table">
<tr>
<td align="center" id='0'></td>
<td align="center" id='1'></td>
<td align="center" id='2'></td>
</tr>
<tr>
<td align="center" id='3'></td>
<td align="center" id='4'></td>
<td align="center" id='5'></td>
</tr>
<tr>
<td align="center" id='6'></td>
<td align="center" id='7'></td>
<td align="center" id='8'></td>
</tr>
</table>

But how can i set X and O backgrounds?, thanks.

 

 

Either with images, or just use jQuery's .html() to push X and O characters to the divs.

 

I really hope this isn't homework, at this point. :laugh:

  • 0
  On 25/07/2013 at 21:10, neohelp said:

Absolutly makes no sense to do this with PHP.

You are 100% right. Being able to hide the source code from the player so they don't manipulate it is 100% useless. :rolleyes: Since you clearly have no real input for this discussion, I look forward to not seeing anymore posts from you so we can continue to see how xScence tackles this task.

  • 0

I have this html:

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <title>Tic-Tac-Toe</title>
  <meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
      <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
</head>
<script>
$(document).ready(function(){


var turn = 0;
var tic = '';






$('td').click(function(e) {
turn = 1;
if(turn == 1){
tic = 'O';
}
makeMove(e.target.id);
});


function makeMove(square){


$.ajax({
type: "POST",
url: "tictactoeAjax.php",
data: { clicked: square, symbol: tic, bot: 0 }
}).done(function(ret){
$("#"+square).html('O');
turn = 2;
aiTurn(square);
});


}


function aiTurn(square){


turn = 2;


if(turn == 2){
tic = 'X';
}


$.ajax({
type: "POST",
url: "tictactoeAjax.php",
data: { clicked: square, symbol: tic, bot: 1 }
}).done(function(ret){
alert(ret);
$("#" + ret).html('X');
});


}
});
</script>
<body>


<table border="1" width="300" height="300" id="tictactoe" name="table">
<tr>
<td align="center" id='1'></td>
<td align="center" id='2'></td>
<td align="center" id='3'></td>
</tr>
<tr>
<td align="center" id='4'></td>
<td align="center" id='5'></td>
<td align="center" id='6'></td>
</tr>
<tr>
<td align="center" id='7'></td>
<td align="center" id='8'></td>
<td align="center" id='9'></td>
</tr>
</table>


</body>
</html>

The ajax:

<?php
require('conf.php');
session_start();
$clicked = $_POST['clicked'];
$symbol = $_POST['symbol'];
$bot = $_POST['bot'];


if($bot == 0){
//Human
$sql = mysql_query("UPDATE movies SET symbol = '".$symbol."' WHERE field='".$clicked."'") or die (mysql_error());
if($sql){
echo $symbol;
}
}elseif($bot == 1){
//AI
function ai_think(){
$sql = mysql_query("SELECT * FROM movies WHERE symbol = 'O'") or die (mysql_error());


while($rows = mysql_fetch_object($sql)){


//$rows->field returns 17

/*



*/

}


}
echo ai_think();
//$sql = mysql_query("UPDATE movies SET symbol = '".$symbol."' WHERE field='".ai_think()."'") or die (mysql_error());
}


?>

DB:

sql.jpg

So now if player (me) clicked on 1 and 7 position the AI must place in position 4 so he will stop me to make 3 same symbols.
but if i use this code:

if($rows->field == 1 && $rows->field == 7){
//nothing happens
}
if($rows->field == 17){
//its stays in this if so if i make other operations they wont be checked because this returns allways true
}

I need some logic here: to check (most) strategy and stop them. Thanks alot.

while($rows = mysql_fetch_object($sql)){


//$rows->field returns 17


}
This topic is now closed to further replies.
  • Posts

    • This site is just old men ranting at clouds. Neowin knows its audience.
    • That's nice and all. but I generally just stick with Lutris paired with 'ge-proton' (which gets updated fairly often (June 1st was last update) as the 'ge-proton' entry in Lutris uses stuff here... https://github.com/GloriousEggroll/proton-ge-custom/releases ) and the like to play my games. p.s. if a person wants to stick with a specific version from that link you can download a specific version and extract it to "~/.local/share/lutris/runners/proton/". then select it in Lutris options on game shortcut is the basic idea. because by default the standard 'ge-proton' entry will automatically get updated which can occasionally cause issues even though it's usually fine. but manually setting it on a specific version will prevent the standard updates on 'ge-proton' from messing with it on a particular game you may have issues with if that gets updated etc. one good example of the 'ge-proton' updates messing with a game in particular is the offline version of RDR2 1491.50 as I setup a specific version there and after removing the 'vulkan-1 (native)' entry in 'Wine configuration' on 'RDR2.exe' entry (if you don't remove this the game won't start up) is when the 'ge-proton' updates, it will restore that 'vulkan-1 (native)' entry and prevent the game from working. you can always remove the entry on the RDR2.exe in Wine configuration specifically after updates, but doing that everytime that updates will get old quickly. hence, keeping it on a specific GE Proton version stops me from having to mess with it as then you just adjust it once and you are done with it. also, when using 'bat' files to start a game (like Hitman: WoA for example using Peacock etc) I had some issues with GE Proton after '9-27', so I got the game locked to '9-27' (April 1st) instead of the newer ones (10-1 etc).
    • Sam Altman says AI could soon help with discovering new knowledge by Hamid Ganji OpenAI is currently at the forefront of developing powerful AI models, while its ChatGPT product is rewriting our traditional way of looking for new information. The company's CEO, Sam Altman, now says AI could even help humans discover new knowledge. He also described AI agents as junior employees. Speaking at the Snowflake Summit 2025, Altman boasted that AI agents can act like junior employees, saying, "You hear people that talk about their job now is to assign work to a bunch of agents, look at the quality, figure out how it fits together, give feedback, and it sounds a lot like how they work with a team of still relatively junior employees." OpenAI CEO also added AI agents could help humans discover new knowledge in "limited cases" or "figure out solutions to business problems that are kind of very non-trivial." While the use of AI for scientific discovery is still viewed with skepticism, the technology has proven its capabilities for new discoveries in several cases. For example, the Microsoft Discovery platform, designed for accelerating scientific research and development by AI agents, was recently able to discover a new chemical for cooling data centers in just 200 hours, a process that normally takes years to research and complete by humans. AI firms are also shifting their focus toward developing AI agents capable of performing various tasks. OpenAI recently unveiled Codex, which contains AI agents for helping programmers write and debug code. According to Altman, OpenAI engineers are already using Codex. As AI agents become more intelligent, more employees should be concerned about losing their jobs. Companies have already started replacing some specific roles with AI. For example, Duolingo has replaced its contract workers with AI, while Shopify managers need to provide reasons why AI cannot handle a job before seeking approval for new hires. Via: Business Insider
    • I personally don't think there will be many survivors past the ESU date, but I can be wrong🙂 >Firefox still supports Windows 7 (until the end of August), which will be just over 16 years since release. Well, yes, but it's an ESR version, which kind of doesn't count as fresh for me. So the last mainline version of Firefox with W7 support was 115, which was released in 2023, exactly around the W7 ESU expiration.
    • Hey, sounds like it’s definitely time for an upgrade. The R7000 had an excellent run! If you want lots of wired ports and future-proofing, the Asus RT-BE88U is a killer choice. It’s got 2x 10GbE, 4x 2.5GbE, and handles WiFi 7 like a champ. Super fast, stable, and the ASUS firmware is solid with loads of features. The TP-Link BE900 is also great, sleek design, strong performance, and a combo 10G port (RJ45/SFP+), but it has fewer wired ports than the Asus. Netgear RS700S is powerful too, but the firmware isn’t as flexible and only has one 10G port. It might feel familiar from your R7000. If wired ports are a big deal, maybe adding a 2.5G or 10G switch later gives you more options. My vote is RT-BE88U all the way.
  • Recent Achievements

    • First Post
      nothin earned a badge
      First Post
    • Enthusiast
      Epaminombas went up a rank
      Enthusiast
    • Posting Machine
      Fiza Ali earned a badge
      Posting Machine
    • One Year In
      WaynesWorld earned a badge
      One Year In
    • First Post
      chriskinney317 earned a badge
      First Post
  • Popular Contributors

    1. 1
      +primortal
      186
    2. 2
      snowy owl
      130
    3. 3
      ATLien_0
      130
    4. 4
      Xenon
      119
    5. 5
      +FloatingFatMan
      96
  • Tell a friend

    Love Neowin? Tell a friend!