Question

I am working on a jQuery live file upload.

There is a form in my application with a file field. when the user selects a file, then I need to upload it using the AJAX file upload method. Then later when user submit on the “Submit” then the real file upload will take place .

Using the following, my AJAX file upload is going perfectly. But the problem is that after the file upload, the file field’s value will get cleared.

var url = $('#site').val()
url = url + "/ajax/addTmpImg";

var id = 'my_file';

alert($('#' + id).val()); // THIS WILL SHOW FILE FIELD VALUE

$.ajaxFileUpload({
    url: url,
    secureuri: false,
    fileElementId: id,
    dataType: 'json',
    data: {
        'type': file_name,
        'name': file_name
    },
    success: function (data, status) {
        alert($('#' + id).val()); // THIS WILL RETURN EMPTY
    },
    error: function (data, status, e) {
        alert(status);
    }
});

Before the file upload, this will alert the file field’s value and after the file upload, doing the same will show nothing.

Answer 1

Try to define a global variable and assign the value $('#'+id).val() to that variable.

Like this:

var someVar = $('#'+id).val();

You can access that variable later.