Rename file with AjaxForm Jquery

How can I rename my picture before upload ?

I tried this : $('#sortpicture').prop('files')[0] = $('#namePicture').val(); but it doesn't work.

I would like rename my picture with the value from #namePicture

//elements
var progressbox     = $('#progressbox');
var progressbar     = $('#progressbar');
var statustxt       = $('#statustxt');
var submitbutton    = $("#SubmitButton");
var myform          = $("#UploadForm");
var output          = $("#output");
var completed       = '0%';

console.log($('#namePicture').val());
$('#sortpicture').prop('files')[0] = $('#namePicture').val();

$(myform).ajaxForm({
    beforeSend: function() {
        submitbutton.attr('disabled', '');
        statustxt.empty();
        progressbox.slideDown();
        progressbar.width(completed);
        statustxt.html(completed);
        statustxt.css('color','#000');
    },
    uploadProgress: function(event, position, total, percentComplete) {
        progressbar.width(percentComplete + '%');
        statustxt.html(percentComplete + '%');
        if(percentComplete>50)
        {
            statustxt.css('color','#fff');
        }
    },
    complete: function(response) { // on complete
        console.log(response.responseText);

        myform.resetForm();  // reset form
        submitbutton.removeAttr('disabled'); //enable submit button
        progressbox.slideUp(); // hide progressbar
    }
});

Upvotes: 0

Views: 71

Answers (1)

Poul Bak
Poul Bak

Reputation: 10929

Input[type=file] is readonly, you can only set the value by browsing, not via JavaScript.(security!) However if you want to send a different name to the server, you can make a input[type=hidden] and set it's value to he filename you want. Then on the server, you give it that name.

Upvotes: 1

Related Questions