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');
    }
});

Can you show us the HTML for the form? And the code where you're picking the value up from the form into your "image" variable? Or is the point of your question that you don't know how to do this bit? — Sepster, Sep 10 '12 at 03:20
ajax does not support file uploads. standard workaround is to have your JS create a hidden iframe and perform a standard post upload in there. — Marc B, Sep 10 '12 at 03:32
you could use some jQuery Ajax File Upload plugin for doing that — Sudhir Bastakoti, Sep 10 '12 at 03:37
@Marc Can u show me how to use Hidden iframe and getting name of file just for inserting to db ? — Mr.EchoAnd, Sep 10 '12 at 03:40
There are a lot of tutorials out there, and they are all pretty decent. Here are two: http://joekuan.wordpress.com/2009/06/12/ajax-a-simplified-version-of-file-upload-form-using-iframe/ and http://viralpatel.net/blogs/ajax-style-file-uploading-using-hidden-iframe/ but to be honest, those were just the first two results from google... https://www.google.com/search?q=ajax+file+upload+hidden+iframe Good luck! — xbakesx, Sep 10 '12 at 04:05
`image = $("image").val();` isn't going to work... I presume you're using an `` input (which is why I wanted to see your HTML)? Might be better to give that tag an `id='image-filename'` and then reference it by `image = $("#image-filename").val();` — Sepster, Sep 10 '12 at 04:19

Vidyadhar · Answer 1 · 2013-04-26T13:23:59.727

0

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>`

edited Apr 26 '13 at 13:23

answered Sep 10 '12 at 14:02

Vidyadhar

1,088
9
15

I am using pure Jquery Ajax for inputing data,Uploading with iframe is best idea ! that will work like AJAX – Mr.EchoAnd Sep 11 '12 at 01:43

score 0 · Accepted Answer · edited May 23 '17 at 12:20

0

Update:

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

Like this methode

edited May 23 '17 at 12:20

Community

1
1

answered Mar 06 '14 at 04:55

Mr.EchoAnd

88
1
10

Get image name when uploading

2 Answers2