How to make a sudoku interactive game table grid

wewehalim 0 Junior Poster in Training

14 Years Ago

Hi, i am making a website which prove a sudoku interactive game that enables users to play it.

the game data is in the form of database and have the following field:

The columns labelled row1,row2, ... row9, are the 9 rows of the completed game. The 9 columns labelled game_row1, game_row2,... game_row9 show the rows of the game with numbers missing (value "0" show the missing number and users need to put the number in it). The numbers in each row are separated by commas.

there is 9 different games altogether (game_no) and 3 type of difficult level (rating).

Here is an example of one game stored in the table.

Column Data
Name Value
================================
game_no 3
rating medium
row1 9,8,6,4,2,5,7,1,3
row2 3,7,5,6,8,1,4,2,9
row3 2,1,4,7,3,9,8,6,5
row4 4,6,1,8,7,3,5,9,2
row5 5,2,7,9,1,6,3,8,4
row6 8,9,3,2,5,4,1,7,6
row7 1,3,8,5,9,2,6,4,7
row8 6,5,2,1,4,7,9,3,8
row9 7,4,9,3,6,8,2,5,1
game_row1 0,8,0,0,0,0,0,1,3
game_row2 0,0,5,6,0,1,0,2,0
game_row3 0,0,4,0,3,0,8,0,0
game_row4 0,0,1,8,0,3,5,0,0
game_row5 0,0,0,0,0,0,0,0,0
game_row6 0,0,3,2,0,4,1,0,0
game_row7 0,0,8,0,9,0,6,0,0
game_row8 0,5,0,1,0,7,9,0,0
game_row9 7,4,0,0,0,0,0,5,0

the first page will direct user to choose either game_no or level of difficulty, after that, a sudoku game with the value inside will appear to be played by the user. The 'gamerow1' - 'gamerow9' should fill the value in each box in sudoku. If the value is "0", then the box will become [input type="text"] to be filled with user. Whenever a user enters a number in any of these input textfields an AJAX request will be sent to the server to check that the number entered is correct.
So basicly i need to do this using ajax.

I am able to generate the first page, but it can't generate the sudoku table, actually i don't know how to generate the table that consist the value from database.
The database is provided by a server, so i wont write the code for linking the database here.

Here is my code so far:
This is the code that generate the first page:

<script type="text/javascript">
function validate_fields() {
  var gameNum = document.getElementById("game_no").value;
  var gameLvl = document.getElementById("rating").value;
  if (gameNum && gameLvl) {
     alert("Please select either a game number OR a level of difficulty only.\nDo not select both.");
     return false;
  }
  return true;
 }
</script>

<form method="post" action="index.php" onsubmit="return validate_fields()">
<p><label for="game_no">Enter Game Number</label>
<select name="game_no" id="game_no">
<option value>Select Number</option>
<?php
  $link = mysql_connect(..., ..., ...);
  mysql_select_db(...., $link);
  $query_string = "select distinct game_no from sudoku order by game_no";
  $game_no = mysql_query($query_string);
  while($rowNumber = mysql_fetch_assoc($game_no)){
  echo '<option 
value="'.$rowNumber['game_no'].'">'.$rowNumber['game_no'].'</option>';
  }
?>
</select></p>

<p><label for="rating">Choose Game Level</label>
<select name="rating" id="rating">
<option value>Select Level</option>
<?php
  $link = mysql_connect(..., ..., ...);
  mysql_select_db(...., $link);
  $query_string = "select distinct rating from sudoku order by rating";
  $rating = mysql_query($query_string);
  while($rowLevel = mysql_fetch_assoc($rating)){
  echo'<option value="'.$rowLevel['rating'].'">'.$rowLevel['rating'].'</option>';
  }
?>
</select></p>

<p><input type="submit" value="Search"></p>
</form>

I am still doing the code to produce the second page, but it does not work at all. I don't if it is true already, can I get some helps?
Here is my code so far (in this code, i try to generate the game from game_no="3"):

<?php
      $link = mysql_connect(..., ..., ...);
      mysql_select_db(...., $link);

      $sql="select * from sudoku where game_no="3"";
      $result=mysql_query($sql) or exit(mysql_error());
      print '<table>';
      $i=1;
      while ($gamerow=mysql_fetch_assoc($result))
      {
         $curGR="gamerow$i";
         $gamerow=explode(',',$$curGR);
         print '<tr>';
         for($c=0;$c<9;$c++)
         {
            print '<td>';
            if($gamerow[$c]==0)
            {
               print "<input type=\"text\" name=\"game[{$$curGR}][$c]\" />";
            }
            else
            {
               print $gamerow[$c];
            }
            print '</td>';
          }
          print '</tr>';
      }
      print '</table>';
?>

Thanks

javascript

1 Contributor
0 Replies
60 Views

Be the first to reply

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.