title: Having issues uploading an image via ajax
body: <p>Sorry if the title isn't descriptive enough!</p>
  
  <p>The idea is to have a div popup and allow users to type in their feedback and possibly submit a screenshot. </p>
  
  <p>This is the javascript inside the page (which is called via ajax into a div).</p>
  
  <h2>Javascript</h2>
  
  <pre><code>$("#submitFeedback").click(function(){
    //Check if the form is valid
    if($("#form").valid()){
      $("#form").hide(); //Hide the form
      $("#feedbackReport").append("&lt;h2 style='color:white'&gt;Submitting!&lt;/h2&gt;&lt;hr /&gt;" +
        "&lt;div style='text-align: center'&gt;&lt;img src='images/loader.gif' /&gt;&lt;/div&gt;");//Display loading spinner
      $.ajax({  
        type: "POST",  
        url: "ajax/submit_feedback.php",
        cache: false,
        data: $("#form").serialize(),//serialize form for submission
        success: function(data) {
          $("#feedbackReport").empty();//Clear form after submission
          $("#feedbackReport").append("&lt;h2&gt;Thank you!&lt;/h2&gt;&lt;span id='close'&gt;&amp;#10006;&lt;/span&gt;&lt;hr /&gt;"
            +"Your feedback has been submitted successfully!"
            +"&lt;br /&gt;&lt;br /&gt;&lt;span id='cancel'&gt;Close&lt;/span&gt;");
          $("#cancel,#close").click(function(){
            $("#feedbackReport").parent().hide();
          });
        }
      });
      return false;//Prevent page from changing
    }
  });
  </code></pre>
  
  <p>Now, if point my browser to the actual ajax page (ajax/feedback.php) and submit an image, it works fine! When I run it from index.php and call the feedback window via ajax, it wont submit my picture, only the text.</p>
  
  <p>I know my submit_feedback.php page works fine because of this, I just have no idea why it won't post the image properly.</p>
  
  <p>Any tips or help would be greatly appreciated!</p>