2015-10-01 1 views
1

Средство длинной истории Я занимаюсь некоторыми HTML/PHP/JS, и все происходит хорошо. Я делаю макет игры, и я возился с созданием игровой карты. Возьмите 1, нарисовав серверный сервер карты и передав его клиенту на каждую загрузку страницы, и теперь я пытаюсь использовать его с использованием HTML5 canvas и clientide javascript для обработки чертежа.Форма работает с кликом, но не с JS submit

Я хочу, чтобы пользователь мог щелкнуть по карте и загрузить новую страницу с информацией, полученной из базы данных о содержимом сетки, на которую они нажимают. Используя метод на стороне сервера, я использовал карту на стороне сервера, чтобы передать координаты кликов и определить, на какую сетку они нажали, используя некоторую простую математику.

Я более или менее отработал, получив координату щелчка от слушателя mousedown на холсте, но теперь я пытаюсь сделать ту же функцию обновлением формы для навигации, а затем загружать страницу с помощью javascript. Форма работает (если я ввожу -1, -1 в поля координат x/y и нажимаю go, я получаю информацию о сетке -1, -1, но при нажатии на сетку -1, -1 не передает POST-переменные должным образом (страница делает обновление, а части сценария (PHP), который проверяет переменную POST не удается найти, но не найдете их, если вы нажали кнопку идти

Полотна и форма выглядит следующим образом:.

<div id="scrollable"> 
 
\t <canvas id="gameCanvas" width="<?php echo $max ?>" height="<?php echo $max ?>"></canvas><br/> 
 
</div> 
 
<div> 
 
\t <form id="gamenavform" action="game2.php" method="post"> 
 
\t \t X Coord: <input id="gamenavx" type="text" name="xcoord" size="2" /><br/> 
 
\t \t Y Coord: <input id="gamenavy" type="text" name="ycoord" size="2" /><br/> 
 
\t \t <input type="submit" name="mapnav" value="Go" /> 
 
\t </form> 
 
</div>

соответствующая часть JavaScript выглядит следующим образом:

<script> 
 
document.addEventListener("DOMContentLoaded", init, false); 
 
\t 
 
function init() { 
 
\t var canvas = document.getElementById("gameCanvas"); 
 
\t var ctx = canvas.getContext("2d"); 
 
\t ctx.fillStyle = "#FF0000"; 
 
\t ctx.fillRect(0,0,99999,99999); 
 
\t canvas.addEventListener("mousedown", getPosition, false); 
 
} 
 

 
function getPosition(event) { 
 
// long function snipped 
 
\t var navx = document.getElementById("gamenavx"); 
 
\t var navy = document.getElementById("gamenavy"); 
 
\t navx.value = Math.floor(x/64) - <?php echo $gameInfo[1] ?>; 
 
\t navy.value = Math.floor(y/64) - <?php echo $gameInfo[1] ?>; 
 
\t document.getElementById("gamenavform").submit(); 
 
} 
 
</script>

И только для полноты картины, часть PHP, который проверяет переменные POST выглядит следующим образом:

if(isset($_POST['mapnav'])) { 
 
\t $coords[0] = $_POST['xcoord']; 
 
\t $coords[1] = $_POST['ycoord']; 
 
} 
 
else { 
 
\t $coords[0] = 0; 
 
\t $coords[1] = 0; 
 
}

При нажатии на холсте, поля навигации меняются на соответствующую координату, но когда страница загружается, они появляются по умолчанию 0,0, так как ты gh это была новая загрузка страницы без значений POST. Когда я вставляю код отладки после «if (isset ($ _ POST ['mapnav'])« Я только когда-либо оцениваю значение true, если я достиг страницы, нажимая «go» в форме навигации, вместо того, чтобы нажимать на холст, Загружает новую страницу (которая может быть вызвана только вызванной функцией отправки, она не находится в привязке или что-то еще), но не выполняет вышеуказанный тест и выполняет условие else.

Есть ли что-то, что я делаю неправильно или Отсутствует?

EDIT: Я вижу, что то, что мне не хватает, - это то, что нажатие кнопки submit устанавливает переменную, которую я проверяю, но JS submit не делает этого. Я уверен, что есть способ JS click, который я мог бы сделать это может случиться, я мог бы также проверить, действительно ли установлено значение (ы). Есть ли какая-либо практическая причина идти одним путем над другим? Или, возможно, другой op это просто лучше?

+1

причина в том, что если вы не нажмете на кнопку отправки, значение 'mapnav' не в курсе! – Jeff

+0

Значения фактически переданы, но только переменная mapnav не установлена? Каким будет подходящий способ реструктуризации этого кода, чтобы обойти это ограничение? – SkoobyDoo

+0

да, точно! Я отправлю некоторые решения через секунду (может быть, минут ....) – Jeff

ответ

1

На странице PHP вы проверить mapnav, как это:

if(isset($_POST['mapnav'])) 

Однако, если вы отправите форму с Javascript, вы не установите значение нажатием кнопки.

Возможное решение (ы)

  • Попробуйте еще одно условие, чтобы проверить, если координаты присутствуют.
  • Попробуйте установить определенное значение в поле скрытой формы.
+0

будет isset ($ _ POST ['xcoord']) Заставить кого-нибудь съеживаться, несмотря на то, что он явно не проверяет координату y? – SkoobyDoo

+0

Почему бы не сделать 'if (isset ($ _POST ['xcoord']) && isset ($ _POST ['ycoord']))'? – JiFus

+0

Я не могу думать о сценарии, где один установлен, а другой нет. не могла бы даже попытка пустого представления установить y-координату на пустую строку, а не на нуль или отмену или что-то еще? – SkoobyDoo

0

Значение mapnav будет получить только в курсе, если вы на самом деле нажмите на форму-submit- кнопку!

Таким образом, вы получили несколько вариантов решения:

Eighter вы установить новую переменную, которая может быть в скрытом ввода и оценки в PHP для этого.

Или вы оценить, если вы получили значение для xcoord

Смежные вопросы