title: HTML Form Blur JQuery Function Call That Calls PHP
body: <p>I am a JQuery/JS newb, and am having trouble with a simple .blur() event call.</p>
  
  <p>Basically I have an html form, with inputs that have "id='validate'" that are supposed to call a php script to validate the existence of what is typed in the input element of the form in the database. </p>
  
  <p>Any help will be appreciated!</p>
  
  <p>At the moment I am getting the error: "SyntaxError: missing : after property id @ line 6"[at 'alert("Called!!"),'], but if I comment it out then nothing happens at all.</p>
  
  <p>HTML: </p>
  
  <pre><code>&lt;script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script src='../js/validate.js'&gt;&lt;/script&gt;
  &lt;!DOCTYPE html&gt;
  &lt;html&gt;
  ...
  &lt;body&gt;
  ...  
  &lt;form method="POST" action="upload.php?t=0" class="formbox" style="float:left;" name='aform'&gt;
      &lt;label&gt;Category: &lt;/label&gt;&lt;input type="text" id='validate' maxlength="30" name="category"/&gt;&lt;br /&gt;
  
      &lt;input style="margin-left:35%;width:130px;" type="submit" value="Submit Article" /&gt;                     
  &lt;/form&gt;
  ...
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>validate.js:</p>
  
  <pre><code>$(document).ready(function(){
      $('#validate').blur(function(){
          $.ajax({
  
                  type: "POST",
                  url: "../php/validate.php",
                  data: aform.elements["category"].value,
                  success: function(msg){
                      alert("Category exists!");
                  },
                  error: function(){
                      alert("Error!");
                  }
  
           });
      });
  });
  </code></pre>
  
  <p>validate.php:</p>
  
  <pre><code>&lt;?php
      include '../php/db.php';
      echo "Called!";
  
      $cat = mysqli_real_escape_string($con, $_POST['category']);
  
      $query = mysqli_query($con, "SELECT DISTINCT * FROM Category WHERE Name='".$cat."';");
  
      if(mysqli_num_rows($query) == 1){
          echo "Category Exists!";
      }else if(mysqli_num_rows($query) == 0){
          echo "No Category with that name found!";
      }else{
          echo "Too many Categories found!";
      }
  ?&gt;
  </code></pre>
  
  <p>Thanks in advance!</p>
  
  <p>EDIT: For future reference, I was having trouble referencing the POST data, I ended up changing "data: aform.elements["category"].value," to 'data:"cat="+document.querySelector('[name = "category"]').value,' in the js file and referencing "$_POST['cat']" in the php file</p>