文件上传javascript FormData不替换旧的FormData文件/数据

时间:2018-12-21 04:16:06

标签: javascript laravel file-upload axios jquery-steps

因此,我在 jquery-step 向导中将此文件上传了代码。

第一个向导步骤中有文件上传,但是它只是读取文件并在第二个向导步骤中返回数据

<form class="form" role="form" id="read-excel" method="POST" action="{{ url('job/readexcel') }}" enctype="multipart/form-data">
@csrf<div class="form-group">
            <label for="input-file-now"> File Excel </label>
            <input type="file" id="fileexcel" name="fileexcel" class="dropify" required data-allowed-file-extensions="xls xlsx" />
        </div>
        <button class="col-md-12 btn btn-dark" type="submit">Review & Summary</button>
</form>


所以在第二步,我希望第一步的文件上传到这里。

$('form#read-excel').submit(function (e)  {
    console.log('submited');
    e.preventDefault();
    let formData = new FormData(this);
    $(`#the-body`).empty();

    axios.post( READ_FILE_URL, formData, config)
    .then( (response) => {
        console.log(response);
        $('body').loadingModal('destroy')
        //for loop code
        //do something..
        //go to 2nd step
    })
    .catch( (error) => {
        $('body').loadingModal('destroy')
        alert('Error see log');
        console.log(error);
    });
    $('form#upload-excel').submit( function (e) {
        console.log(formData.get('fileexcel')); 
        e.preventDefault();
        Swal({
            title: 'are u sure?',
            text: 'Some TnC.",
            type: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#3085d6',
            cancelButtonColor: '#d33',
            confirmButtonText: 'Ok'
        }).then((result) => {
            if (result.value) {
                axios.post(UPLOAD_URL, formData, config)
                    .then((response) => {
                        console.log(response);
                        $('body').loadingModal('destroy')
                        swal({
                            title: 'Good!',
                            html: 'upload success ',
                            type: 'success',
                            showCancelButton: false,
                            showConfirmButton: false
                        })
                    })
                    .catch((error) => {
                        $('body').loadingModal('destroy')
                        alert('error')
                        console.log(error);
                    });
            }
        })

        e.stopImmediatePropagation(); // This Does the work for prevent upload double times
    })
})

情况就是这样。 当我上传文件(例如: data1.xlsx ),然后转到第二个向导步骤并记录FormData console.log(formData.get('fileexcel'))时。它返回 data1.xlsx 。但是当我回到第一步并使用其他文件(例如: data2.xlsx )重新上传并转到第二页并将其上传到服务器时。它返回 data1.xlsx 而不是 data2.xlsx

0 个答案:

没有答案