0

I am struggling with uploading a file through an ajax form without using FormData. FormData isn't an option because the form contains credit card info that I am tokenizing with a third party and I don't want the CC info submitted to my backend.

I did see this question, which I have used as a starting point, but I'm fairly new to jQuery and struggling with implementation.

I am not getting a submittal of the var file at all, but everything else works great. Am I not collecting the file correctly or am I not bringing it into scope the right way?

My upload.js file: 

var file;
        $("#file").on("change", function(){
            var file = this.files[0],
            filename = this.files[0].name;
            filesize = this.files[0].size;
            //calling alert(file) provides a response of [object file] 
        })

function handleResponse(response) {
    // fires if credit card info is successfully tokenized
    if (response.status_code === 201) {

        var fundingInstrument = response.cards != null ? response.cards[0] : response.bank_accounts[0];

        //rest of the form inputs
        var name = $('#name').val();
        var contact_name = $('#contact_name').val();
        var cell = $('#cell').val();
        var address_1 = $('#address_1').val();
        var city = $('#city').val();
        var state = $('#state').val();
        var zip = $('#zip').val();
        var tax = $('#tax').val();

        //trying to bring file var in scope 
        var file = file;


        // ajax .post
        jQuery.post(baseURL+'/contractors/edit', {
            uri: fundingInstrument.href,
            name: name,
            contact_name: contact_name,
            cell: cell,
            file: file,
            address_1: address_1,
            city: city,
            state: state,
            zip: zip,
            tax: tax,
            file: file,
        }, function(r) {
            // Check backend response
            if (r.status === 200) {...
Community
  • 1
  • 1
retrograde
  • 2,979
  • 6
  • 28
  • 54
  • You can't upload files with ajax without `formData`, it can't be done. You'll have to look into the old iFrame techniques instead, but are you sure you should be handling credit card info at all ? – adeneo Dec 31 '14 at 22:17
  • If you are on HTTPS the connection is encrypted, so you can post the the CC tokenized form data, the encryption SSL cert will protect the form data post to your backend – Brian Ogden Dec 31 '14 at 22:18

0 Answers0