Get image name when uploading

Question

I have form input as follows:

-------------------------Form-------------------------

Title : [text box]

Category : [Combobox]

Content : [Text area]

Images : [File with multiple choose]

[button]

------------------------End Form-----------------------

I am using PHP and AJAX when inserting data but have problems with uploading. I cannot get the file name (Image name) for uploading and inputting to the database.

Here is a little of my AJAX script:

data = "action=add&kode="+kode+"&file="+image+"&title="+title+"&categori="+categori+"&content="+content;
$.ajax({
    url: "action/prosesPOST.php",
    type: "POST",
    data: data,
    cache: false,
    success: function(msg){
        if(msg=="yes"){
        }else{
            $("#status").html("Failed...");
        }
        $("#status").html("");
        $("#loading").hide();
        $("#form-box").fadeOut("fast");
        $("#table").load('action/prosesPOST.php?action=loaddata');
    }
});

Answer 1

Update:

Ajax cant handle "uploading image" so i use hidden iframe method, like the comments the best way for me,

Like this methode

Answer 2

jQuery forms plugin that posts your files.

<form action="#" method="post" enctype="multipart/form-data">
    <input type="file" name="myfile"><br>
    <input type="submit" value="Upload File to Server">
</form>
<script src="jquery.js"></script>
<script src="jquery.form.js"></script>

(function() {


    $('form').ajaxForm({

   complete: function(xhr) {
    status.html(xhr.responseText);
   }
    }); 

})();       
</script>`