title: PHP header wont redirect with AJAX
body: <p>For a project we have to create a basic log in system.  Im trying to use REST to manage my entire page.  Now I believe Im missing or misunderstanding some key concept here but I've been trying to figure out how to do this for ages.  Were not allowed to use libraries for this exercise so I cant use JQuery.  </p>
  
  <p>So heres my problem:  I have a .js file that checks for username length and password length and etc.... in this .js file I also have an ajax function that sends the username and email to PHP to verify that there is not already an existing user with that email or username using SQL. </p>
  
  <pre><code>function checkUser()
          {
              var ajax = new Ajax(); // instantiates my external ajax class
              var email = document.getElementById("newEmail").value;
              var username = document.getElementById("newUserName").value
              ajax.post("index.php?method=register&amp;check=check", "newEmail=" + email + "&amp;newUserName=" + username, callbackCatch)
  
          }
      function callbackCatch(param)   
          {
              var responseMessages = JSON.parse(param.responseText);
  
              emailMessage = responseMessages.emailMessage;
              userNameMessage = responseMessages.userNameMessage;
              userEmailIsOk = responseMessages.userEmailIsOk;
              userNameIsOk = responseMessages.userNameIsOk;
              release = true;
              if((userEmailIsOk + userNameIsOk) != 2)
                  {
                      console.log(userEmailIsOk + userNameIsOk);
                      release = false;
                  }
  
              updateMessageFields();
          }
  </code></pre>
  
  <p>I get a JSON string back which I parse and then compare against my form values.  When everything is find and dandy i click the register button on my form page which posts all the fields back to my php file.  However it seems that when i do this my external ajax class is accessed somehow every time and I get an error : NS_NOINTERFACE: Component does not have requested interface. </p>
  
  <p>Im assuming that because AJAX is running in the backgroud whenever I make a post, even from my form it tries to send back my param which in this case are not compatible.  </p>
  
  <p>I dont know how to fix this.  My PHP file that is suppose to handle the transfer looks like this:</p>
  
  <pre><code>require_once("../database/table.php");
  </code></pre>
  
  <p>class test  {</p>
  
  <pre><code>private $SQLtable;
  
  private $newEmail;
  private $newPswrd;
  private $newUserName;
  private $newFullName;
  
  
  public function test()
      {
          $this-&gt;SQLtable = new table();
          $this-&gt;initClassVars();
          $this-&gt;generateUserName();
          $this-&gt;regUser();
  
  
      }
  function initClassVars()
      {
          if(isset($_POST["newPassword"]))
              {
                  $this-&gt;newPswrd = $_POST["newPassword"];
              }
          if(isset($_POST['newUserName']))
              {
                  $this-&gt;newUserName = $_POST['newUserName'];
              }
          if(isset($_POST["newEmail"]))
              {
                  $this-&gt;newEmail = $_POST["newEmail"];
              }
          if(isset($_POST["newFullName"]))
              {
                  $this-&gt;newFullName = $_POST["newFullName"];
              }
      }
  function generateUserName()
      {
          if(isset($_POST["newFullName"]))
          {
              $suggestedUserName = str_replace(" ", "", $this-&gt;newFullName);
              $this-&gt;newUserName = $suggestedUserName;
          }
      }
  
  function regUser()
      {       
  
                  $this-&gt;SQLtable-&gt;registerUser($this-&gt;newEmail, $this-&gt;newPswrd, $this-&gt;newFullName, $this-&gt;newUserName);
                  $sessionKey = $this-&gt;genKey();
                  $this-&gt;SQLtable-&gt;authUser($this-&gt;newEmail, $this-&gt;newPswrd, $sessionKey);
                  header("location:Location:index.php?method=feed&amp;key=$sessionKey&amp;user=$this-&gt;newEmail");
                  exit;
      }
  
  function genKey($length = 16)
      {
          $options = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789"; //Range
          $key = ""; //Empty holder for key
          for($i = 0; $i &lt; $length; $i++)
              {
                  $code = rand(0, strlen($options) - 1); 
                  $key .= $options[$code];  // Loops through as long as the $length is set and adds a random string char from $options to build a new key.
              }
          return $key;
      }
  </code></pre>
  
  <p>}</p>
  
  <p>As you can see Im toying around with using an API key to control authentication.  I havent gotten the cookies working with it yet, but ill do that after I figure out how to get this registration thing sorted.  </p>
  
  <p>Sorry if ive been unclear.  This is my first question on stackoverflow and basically I never wrote a line of code in my life until about 8 months ago so bear with my newbish code :D.  Thanks.. </p>
  
  <p>Ok so heres the HTML and where the functions are being called:
  This is my form html file.  The doctype and header are added separately as I use them over and over a few times.  </p>
  
  <pre><code>&lt;body&gt;
  
  &lt;h1&gt; Thanks! &lt;!-- $user --&gt;, you're almost there.  We just need a few more details      &lt;/h1&gt;
  
  &lt;form id="registerUser" name="registerUser" action="index.php?method=test" method="post"&gt;
  &lt;p&gt;
  &lt;label for="newFullName"&gt;Full Name: &lt;/label&gt;
  &lt;input type="text" id="newFullName" name="newFullName" value="$newFullName" /&gt;
  &lt;span id="nameMessage"&gt;&lt;/span&gt;
  &lt;/p&gt;
  &lt;p&gt;
  &lt;label for="newUserName"&gt;User Name: &lt;/label&gt;
  &lt;input type = "text" id="newUserName" name="NewUserName" value="$newUserName" /&gt;
  &lt;span id="nicknameMessage"&gt;&lt;!-- $newUserNameMessage --&gt;&lt;/span&gt;
  &lt;/p&gt;
  &lt;p&gt;
  &lt;label for="newEmail"&gt;Email: &lt;/label&gt;
  &lt;input type="text" id="newEmail" name="newEmail" value="$newEmail" /&gt;
  &lt;span id = "newEmailMessage"&gt;&lt;!-- $newEmailMessage --&gt;&lt;/span&gt;
  &lt;/p&gt;
  &lt;p&gt;
  &lt;label for ="newPassword"&gt;Password: &lt;/label&gt;
  &lt;input type="password" id="newPassword" name="newPassword" value="$newPswrd" /&gt;
  &lt;span id = "newPasswordMessage"&gt;&lt;/span&gt;
  &lt;/p&gt;
  &lt;input type="submit" id="register" disabled="disabled" value="Register" onclick=""/&gt;
  &lt;/form&gt;
  
  
  &lt;p&gt;&lt;a href="../../../Index.html"&gt; Click here to go back to the login site and login.   &lt;/a&gt;&lt;/p&gt;
  
  &lt;script type="text/javascript" language="javascript" src="../../js/net/ajaxHandler.js"&gt;    &lt;/script&gt;
  &lt;script type="text/javascript" language="javascript"&gt;var bootstrap = new ajaxHandler();     bootstrap.init(); &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>The entire JS file is this.. its a bit messy but its because Ive been toying with it so much:</p>
  
  <pre><code>var ajaxHandler = function()
  {
      var self = this;
      var release = true;
      var nameField;
      var userField;
      var emailField;
      var passWordField
      var emailMessage;
      var userNameMessage;
  
      self.init = function()
          {
              addEventListeners();
              checkFormForErrors();
          }
  
      self.redirect = function ()
          {
          }
      function addEventListeners()
          {
              nameField       = document.getElementById("newFullName");
              userField       = document.getElementById("newUserName");
              emailField      = document.getElementById("newEmail");
              passWordField   = document.getElementById("newPassword");
  
              Event.addEventListener(nameField, 'click', checkFormForErrors);
              Event.addEventListener(userField, 'click', checkUser);
              Event.addEventListener(emailField, 'click', checkUser);
              Event.addEventListener(passWordField, 'click', checkFormForErrors);
  
              Event.addEventListener(nameField, 'keyup', checkFormForErrors);
              Event.addEventListener(userField, 'keyup', checkUser);
              Event.addEventListener(emailField, 'keyup', checkUser);
              Event.addEventListener(passWordField, 'keyup', checkFormForErrors);
          }
  
      function checkPassword()
          {
          var passWordIsOk;
          var patt        = /\s/;
          var whiteSpace  = patt.test(passWordField);
          var passwordLength = passWordField.value.length;
          if (passwordLength &lt; 8 )
              {
                  document.getElementById("newPasswordMessage").innerHTML = "Your passowrd must be at least 8 charachters long. ";
                  passWordIsOk = false
                  if (whiteSpace)
                      {
                          document.getElementById("newPasswordMessage").innerHTML += "Your Password cannot contain any spaces.";
                          passWordIsOk = false
                      }
              } 
          else
              {
                  document.getElementById("newPasswordMessage").innerHTML = "Password looks good";
                  passWordIsOk = true
              }
          return passWordIsOk;
          }
  
      function checkName()    
          {
              var userNameIsOk;
              var nameMessage = document.getElementById("nameMessage");
              if (!nameField.value)
                  {
                      nameMessage.innerHTML = "You need to enter a name."
                      userNameIsOk = false;
  
                  }
              else
                  {
                      nameMessage.innerHTML = "Name looks great."
                      userNameIsOk = true;
                  }
              return userNameIsOk;
          }
  
      function checkEmailSyntax()
          {
              var EmailIsOk = true
              var patt    = /^([\w!.%+\-])+@([\w\-])+(?:\.[\w\-]+)+$/ ;
              var format  = patt.test(emailField.value);
              if (!format)
                  {
                      document.getElementById("newEmailMessage").innerHTML = "Your email does not appear to be in the right format."
                      EmailIsOk = false;
                  }
              return EmailIsOk        
          }
  
      function checkFullNameSyntax()
          {
              var nameIsOk = true
              if (document.getElementById("newUserName").value == "")
                  {
                      document.getElementById("nicknameMessage").innerHTML = "You must enter a username.  You can always change it later."
                      nameIsOk = false
                  }
              return nameIsOk;
          }
  
      function checkUser()
          {
              var ajax = new Ajax();
              var email = document.getElementById("newEmail").value;
              var username = document.getElementById("newUserName").value
              ajax.post("index.php?method=register&amp;check=check", "newEmail=" + email + "&amp;newUserName=" + username, callbackCatch)
  
          }
      function callbackCatch(param)   
          {
              var responseMessages = JSON.parse(param.responseText);
  
              emailMessage = responseMessages.emailMessage;
              userNameMessage = responseMessages.userNameMessage;
              userEmailIsOk = responseMessages.userEmailIsOk;
              userNameIsOk = responseMessages.userNameIsOk;
              release = true;
              if((userEmailIsOk + userNameIsOk) != 2)
                  {
                      console.log(userEmailIsOk + userNameIsOk);
                      release = false;
                  }
  
              updateMessageFields();
              var ajax = "";
          }
      function updateMessageFields()
          {
              document.getElementById("nicknameMessage").innerHTML = userNameMessage;
              document.getElementById("newEmailMessage").innerHTML = emailMessage;
              checkFormForErrors();
  
          }
      function checkFormForErrors()
          {
              console.log('hi');
              var nameOk = checkFullNameSyntax()
              console.log(nameOk);
              var passOk = checkPassword()
              console.log(passOk);
              var userOk = checkName()
              console.log(userOk);    
              var emailOk = checkEmailSyntax()
              console.log(emailOk);
              console.log(release);
              document.getElementById("register").disabled = true;
              if(release &amp;&amp; nameOk &amp;&amp; passOk &amp;&amp; userOk &amp;&amp; emailOk)
                  {
                      console.log('hey');
                      console.log(release &amp;&amp; nameOk &amp;&amp; passOk &amp;&amp; userOk &amp;&amp; emailOk)
                      document.getElementById("register").disabled = false;
                  }
          }
  }
  </code></pre>