html 폼에서 10x10 숫자 배열 가져 오기

Question

지금 json을 통해 10x10 단일 문자 배열을 허용하는 전함 게임용 PHP 스크립트가 있습니다.

$gameId = $_POST['gameId'];  // int 
$playerId = $_POST['playerId']; //int 
$boardJSON = $_POST['board'];  //10x10 json array 

이 데이터를 제출하려면 html/ajax 양식을 작성해야합니다. 사용자가 10x10 문자 배열을 입력하고 직렬화 한 다음 json으로 보낼 수있는 가장 좋은 방법은 무엇입니까?

이것은 단지 테스트 일 뿐이므로 귀중할 필요는 없으며 작동시켜야합니다.

Answer 1

각 행마다 하나씩 10 개의 문자열 만 있으면 쉽게 테스트 할 수 있습니다. 데이터를 배열에 던지기 위해 약간의 자바 스크립트를 작성하십시오.

Answer 2

10x10 보드는 그렇게 크지 않습니다. 100 자의 문자열을 사용합니다. 위치 0은 왼쪽 상단에, 위치 99는 오른쪽 하단에 있습니다. 문자열은 간단합니다.

Answer 3

가장 쉬운 방법은 단지 형태

<form id='board'> 
    <table> 
     <?php for($y = 0; $y < 10; $y++): ?> 
      <tr class="row-<?= $y ?>"> 
      <?php for($x = 0; $x < 10; $x++): ?> 
       <td class="col-<?= $x ?>"><input type='text' size='1' maxlength='1' name="board[<?= $x ?>][<?= $y ?>]" data-x="<?= $x ?>" data-y="<?= $y ?>"/> 
      <?php endfor; ?> 
      </tr> 
     <?php endfor; ?> 
    </table> 
</form> 

당신은 다음 객체에 양식을 직렬화 this plugin를 사용하여 텍스트 요소 10 × 10의 배열을 가지고하는 것입니다.

var data = {}; 
data.gameId = gameId; 
data.playerId = playerId; 
data.board = $('#board').serializeObject(); 

이제 데이터를 서버로 보낼 수 있습니다.