Strange Javascript Form Behaviour

I am generating the following html form with this php: echo '

Username:
First name:

Solution 1:

Use a tool like Firebug to determine if the browser is sending it without cmd=submitinfo& or if it's being lost on the server side.

Solution 2:

Change:

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

to:

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

You must declare your url variable before you try to use it.

Also, avoid echoing straight HTML to the page. The way you've done it is going to be an absolute pain to debug, update, and stylize.

Solution 3:

Frameworks like jQuery is not really needed for such simple tasks, although I would suggest you taking a look if you plan to implement more JavaScript on your site.

Your code, using jQuery, would look like this:

$("#<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;
});

Looks a bit nicer, I think :)


Also; using frameworks - not jQuery in particular - takes care of browser work-arounds.. so you won't have to.. take care of 'em, that is :)

Solution 4:

I think you need to change the type of the button from "submit" to "button":

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

Share