странное поведение формы javascript

Question

Я генерирую следующую HTML-форму с этим php:

echo "<form name=\"userForm\">
Username:
<input type=\"text\" name=\"username\" />
<br />
First name:
<input type=\"text\" name=\"firstname\" />
<br />
Last name:
<input type=\"text\" name=\"lastname\" />
<br />
<input name=\"Submit\" type=\"submit\" value=\"Update\" onclick=\"submitUserInfo();return false\"/>
</form>";

Который обрабатывается submitUserInfo, который находится здесь:

function submitUserInfo() {
    url = "edit_user.php?cmd=submitinfo&username="+document.userForm.username.value+"&firstname="+document.userForm.firstname.value+"&lastname="+document.userForm.lastname.value;
    var xmlHttp=GetXmlHttpObject();
    if(xmlHttp.responseText == 'true') {
        alert(url);
        xmlHttp.open("GET",url,true);
        xmlHttp.send(null);
        //updateByUser(username);
    }
}

Я определенно определил URL, начинающийся с

edit_user.php?cmd=submitinfo&username 

однако при нажатии кнопки отправки он пытается отправить URL как

edit_user.php?username=

и я не могу понять, почему. Я использовал вышеуказанную технику с другими формами на своем сайте и не могу найти причину, по которой cmd = submitinfo & исключается.

Answer 1

Я думаю, вам нужно изменить тип кнопки с «отправить» на «кнопку»:

<input name=\"Submit\" type=\"button\" value=\"Update\" onclick=\"submitUserInfo();return false\"/>

Answer 2

Изменение:

url = "edit_user.php?cmd=submitinfo&username="+document.userForm.username.value+"&firstname="+document.userForm.firstname.value+"&lastname="+document.userForm.lastname.value;

до:

var url = "edit_user.php?cmd=submitinfo&username="+document.userForm.username.value+"&firstname="+document.userForm.firstname.value+"&lastname="+document.userForm.lastname.value;

Вы должны объявить переменную url, прежде чем пытаться ее использовать.

Кроме того, избегайте echo прямого ввода HTML на страницу. То, как вы это сделаете, будет очень трудно отлаживать, обновлять и стилизовать.

Answer 3

Такие фреймворки, как jQuery , на самом деле не нужны для таких простых задач, хотя я бы посоветовал вам взглянуть, планируете ли вы реализовать больше JavaScript на своем сайте.

Ваш код, использующий jQuery, будет выглядеть так:

$("#<id of form goes here>").submit(function ()
{
    $.ajax({
        data: {
            "username": $("#<id of username-input goes here>").val(),
            "firstname": $("#<id of firstname-input goes here>").val(),
            "lastname": $("#<id of lastname-input goes here>").val()
        },

        url: "edit_user.php"
    });

    return false;
});

выглядит немного лучше, я думаю :)


Также; использование фреймворков, а не jQuery, позаботится об обходных путях в браузере ... так что вам не придется .. заботиться о них, то есть:)

Answer 4

Используйте такой инструмент, как Firebug, чтобы определить, отправляет ли браузер его без cmd = submitinfo и теряется ли он на стороне сервера.