（HTML）JavaScript + PHP - $ _GET错误

Question

What I would like to achieve:

• A index page ( index.html ), which allows the user to register, which runs on JavaScript ( index.js ) to check the fields ( not mentioned in snippet index.js ), and then to redirect to a register page ( scripts/register.php ), which then adds the values to the database.

What is actually happening:

• It redirects to the PHP page correctly, however none of the values seem to be transferred when using the $_GET method: I get an empty page.

What am I doing wrong?

Code:

---

index.html (only a snippet)

<input name="user" type="text" id="user" size="25" />
<input name="email" type="text" id="email" size="25" />
<input name="pass" type="password" id="pass" size="25" />
<input type="submit" name="signup" id="signup" value="Sign Up" />
<script type = "text/javascript", src = "index.js">
</script>

---

index.js (only a snippet)

document.getElementById("signup").onclick = signup;
var aref = "refcode";
function signup()
{
    window.location.href = 'scripts/register.php?emailaddress=' + document.getElementById("email").value + '&username=' + document.getElementById("user").value + '&password=' + document.getElementById("pass").value + '&aref=' + aref;
}

---

scripts/register.php (only a snippet)

<?php 
echo $_GET['emailaddress'];
echo $_GET['username']; 
echo $_GET['password']; 
echo $_GET['aref'];
?>

EDIT: I accidentally copied the wrong code for 'scripts/register.php', sorry to all the answers who corrected it for me

Answer 1

You're never submitting the form (because you don't seem to have one), thus never getting anything but the data that you embed into the URL (which is very unsecure, not a good idea to send sensitive data like passwords like that).

I'm not sure, however, why are you complicating things like that.

If you want to use GET, no need to build the URL yourself, just set up the form with GET method and use regular submit to send it, no javascript needed . Use the hidden field for the aref value (you can populate it when the form is generated, before submitting, etc, whatever works for you):

<form method="GET" action="scripts/register.php">
    <input name="aref" type="hidden" value="refcode" />
    <input name="user" type="text" id="user" size="25" />
    <input name="email" type="text" id="email" size="25" />
    <input name="pass" type="password" id="pass" size="25" />
    <input type="submit" name="signup" id="signup" value="Sign Up" />
</form>

Again, changing the method to POST would be a much better idea . Of course, then you need to access the variables like $_POST['aref'], etc. Just like this:

<form method="POST" action="scripts/register.php">
    <input name="aref" type="hidden" value="refcode" />
    <input name="user" type="text" id="user" size="25" />
    <input name="email" type="text" id="email" size="25" />
    <input name="pass" type="password" id="pass" size="25" />
    <input type="submit" name="signup" id="signup" value="Sign Up" />
</form>

And the PHP (for POST):

<?php 
echo $_POST['email'];
echo $_POST['user']; 
echo $_POST['pass']; 
echo $_POST['aref'];
?>

Answer 2

Your fields are not named the same way in the URL and in register.php. Try this.

<?php 
echo $_GET['emailaddress'];
echo $_GET['username']; 
echo $_GET['password']; 
echo $_GET['aref'];
?>

Answer 3

window.location.href = 'scripts/register.php?emailaddress=' + document.getElementById("email").value + '&username=' + document.getElementById("user").value + '&password=' + document.getElementById("pass").value + '&aref=' + aref;

To access them:

$_GET['username']
$_GET['password']
etc...

In your code you never use the good variable names:

<?php 
echo $_GET['email'];
echo $_GET['user']; 
echo $_GET['pass']; 
echo $_GET['accountref'];
?>

Answer 4

For an Solution without JS, and PHP instead:

<form action="scripts/register.php?<? echo $refcode /* HERES YOUR REFCODE */?>" method="GET">
    <input name="user" type="text" id="user" size="25" />
    <input name="email" type="text" id="email" size="25" />
    <input name="pass" type="password" id="pass" size="25" />
    <input type="submit" name="signup" id="signup" value="Sign Up" />
</form>

Answer 5

The normal way to do what you want is using method Attribute in your form or the .submit() event in jquery. I'll show how I would do that:

HTML without javascript using POST

<form method="post" id="login_form" action='register.php'> 
  <input name="user" type="text" id="user" size="25" />
  <input name="email" type="text" id="email" size="25" />
  <input name="pass" type="password" id="pass" size="25" />
  <input type="submit" name="signup" id="signup" value="Sign Up" />
</form>

php using $_POST

$user = isset($_Post['user']) ? $_Post['user'] : NULL;
$email = isset($_Post['email']) ? $_Post['email'] : NULL;
$pass = isset($_Post['pass']) ? $_Post['pass'] : NULL;

HTML using Jquery

<form id="login_form" method="post" action=""> 
  <input name="user" type="text" id="user" size="25" />
  <input name="email" type="text" id="email" size="25" />
  <input name="pass" type="password" id="pass" size="25" />
  <input type="submit" name="signup" id="signup" value="Sign Up" />
</form>
<script type = "text/javascript" src = "index.js"></script>
//You have a type with a comma

JS

$('#login_form').submit(function(e){
  var data = $(this).serializeArray();
  $.post('register.php',data,
  function(result){
   //Your callback function
 })
})

NOTE My advise to you is that you should use POST method in this case

GET requests a representation of the specified resource. Note that GET should not be used for operations that cause side-effects, such as using it for taking actions in web applications. One reason for this is that GET may be used arbitrarily by robots or crawlers, which should not need to consider the side effects that a request should cause.

and

POST submits data to be processed (eg, from an HTML form) to the identified resource. The data is included in the body of the request. This may result in the creation of a new resource or the updates of existing resources or both.

So essentially GET is used to retrieve remote data, and POST is used to insert/update remote data.