0

My alert for choosing the same square only works in JsFiddle, and I have tried multiple ways to alert for a winner, but nothing is happening. It just sits on the page with x's and o's. I appreciate any and all help, thank you so much!

Ps: It has to be javascript (not java)

Javascript:

// -1 means 0's turn
// 1 means X's turn

// AFTER EVERY MOVE
// UNTIL GAME OVER
// THIS NEEDS TO BE FLIPPED
// IF IT WAS 1, now it will be -1 and vice versa

var turn = 1;

// 0 means no move has been made yet 
// on that particular square
var grid = [
    [0, 0 ,0],
    [0, 0 ,0],
    [0, 0, 0]
];


function makeMove(row, column) {

    if (grid [row][column] == 0) 
        {
grid[row][column] = turn;

        var idOfSquareToChange = row +"" + column;

        if (turn == 1) {

            $("#"+idOfSquareToChange).html('X');
        }else {
            $("#"+idOfSquareToChange).html('O');
        }

        // CHECK IF GAME IS OVER

        // IF GAME ISN'T OVER   
        if (turn == 1) {
            turn = -1;
        }else {
            turn = 1;
        }
        printGrid();
    }else {
        alert('That square has been chosen');
    }
}

function printGrid(){

    var board = grid[0][0] + " " + grid [0][1] + " " + grid[0][2];
    board += "\n";
    board += grid[1][0] + " " + grid [1][1] + " " + grid[1][2];
    board += "\n";
    board += grid[2][0] + " " + grid [2][1] + " " + grid[2][2];

    alert(board);
}

Html:

<table>
            <tr>
                <td id="00" onclick="makeMove(0,0)">00</td>
                <td id ="01" onclick="makeMove(0,1)">01</td>
                <td id ="02" onclick="makeMove(0,2)">02</td>
            </tr>
            <tr>
                <td id ="10" onclick="makeMove(1,0)">10</td>
                <td id ="11" onclick="makeMove(1,1)">11</td>
                <td id ="12" onclick="makeMove(1,2)">12</td>
            </tr>
            <tr>
                <td id ="20" onclick="makeMove(2,0)">20</td>
                <td id ="21" onclick="makeMove(2,1)">21</td>
                <td id ="22" onclick="makeMove(2,2)">22</td>
            </tr>
        </table>

        <hr>
        <input id="myMoveButton" type="submit">
<input type="button" value="Reset" onclick="playAgain()" />

    <script src="java.js"></script>

Css:

table {
    width: 300px;
    height:300px;

    font-size:20px;
}

table td {
    border:solid 1px red;

}
  • 6
    How is this different from your [previous](http://stackoverflow.com/questions/34034984/how-to-alert-winner-in-tic-tac-toe) question? – Tushar Dec 02 '15 at 06:25
  • 1
    See you cannot duplicate questions just to make it noted once again, that will be redundant in this site. Try editing the question with more of your trials, and if possible try creating a `jsfiddle` replicating the problem. – Guruprasad J Rao Dec 02 '15 at 06:27
  • Here is the JsFiddle: https://jsfiddle.net/dL3mkb6x/ – JavaScriptRookie Dec 02 '15 at 06:29

0 Answers0