title: How to insert into database after processing data through ajax formdata
body: <p>My goal is to upload a file and insert data into a database table with ajax using formdata. I can do both separately. Or at least, I can use formdata to upload a file and I can use ajax to insert data into a database, but putting it together has proven difficult. The tutorial for this code seemed to indicate it would do it, and based on what I understand, the ajax is processing the entire form, but it's only uploading the file. I'm not having any issue with that and unfortunately, that's what most of the questions and tutorials I'm finding seem to be directed towards.</p>
  
  <p>I think the issue is with my php insert code. Should I be inserting differently because of how the data is passed through ajax? Or am I more lost than that and just think I'm passing it all through ajax? I feel like I'm so close now, but I can't figure out what I'm doing wrong.</p>
  
  <p>Thank you for any help.</p>
  
  <p>The form and ajax:</p>
  
  <pre><code>&lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"&gt;&lt;/script&gt;
  &lt;script src="http://malsup.github.com/jquery.form.js"&gt;&lt;/script&gt;
  
  &lt;form name="multiform" id="multiform" action="upload.php" method="POST" enctype="multipart/form-data"&gt;
  Name: &lt;input type="text" name="dname" /&gt; &lt;br/&gt;
  Age :&lt;input type="text" name="age"  /&gt; &lt;br/&gt;
  Image :&lt;input type="file" name="photo" /&gt;&lt;br/&gt;
  &lt;input type="submit" value="Ajax File Upload" /&gt;
  &lt;/form&gt;
  
  &lt;script&gt;
  //Callback handler for form submit event
  jQuery(document).ready(function() {
  $("#multiform").submit(function(e)
  {
  
  var formObj = $(this);
  var formURL = formObj.attr("action");
  var formData = new FormData($(this)[0]);
  $.ajax({
      url: formURL,
  type: 'POST',
      data:  formData,
  mimeType:"multipart/form-data",
  contentType: false,
      cache: false,
      processData:false,
  success: function(data, textStatus, jqXHR)
  { alert(data)
  
  },
   error: function(jqXHR, textStatus, errorThrown) 
   {
   }          
  });
  e.preventDefault(); //Prevent Default action. 
  
  });  
  $("#multiform").submit(); //Submit the form
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>The php:</p>
  
  <pre><code>&lt;?php
  
  $username="...";
  $password="...";
  $database="...";
  
  $target = "...";
  $target = $target . time() . '_' . basename( $_FILES['photo']['name']);
  $File = time() . '_' . basename($_FILES['photo']['name']);
  
  
  $name = $_POST['dname'];
  $age = $_POST['age'];
  mysql_connect(localhost,$username,$password);
  @mysql_select_db($database) or die( "Death");
  
  print_r($_POST);
  print_r($_FILES);
  
  mysql_query("INSERT INTO wp_demo('name','age','File')VALUES('$name','$age','$File')");
  
  if(isset($_FILES["photo"]))
  {
  //Filter the file types , if you want.
  if ($_FILES["photo"]["error"] &gt; 0)
  {
    echo "Error: " . $_FILES["file"]["error"] . "&lt;br&gt;";
  }
  else
  {
      //move the uploaded file to uploads folder;
      move_uploaded_file($_FILES["photo"]["tmp_name"],$target);
  
   echo $_FILES['photo']['name'] . " is now available";
  }
  
  }
  
  ?&gt;
  </code></pre>
  
  <p>EDIT: Nevermind. I still don't know what's wrong here, but it ultimately just needs to work in wordpress. I got it to work there with this:</p>
  
  <pre><code>global $wpdb;
  if($wpdb-&gt;insert('wp_demo',array(
      'name' =&gt; $name,
  'age' =&gt; $age,
  'File' =&gt; $File
  ))===FALSE) {
  echo "error";
  }
  else {
  echo "success";
  }
  </code></pre>
  
  <p>Now I just need to figure out why it submits on page load...</p>