آپلود فایل بصورت آجاکس و ذخیره دائم بعد از سابمیت فرم

از dropzoon استفاده کن واسه آپلود فایلهات

سلام.
از کلاس FormData در جاوااسکریپت باید استفاده کنید :

<input type="file">

let fileInput=document.querySelector("input[type='file']");
let progressPercent;

fileInput.addEventListener('change',function(){

    let formData=new FormData();

    formData.append('file',this.files[0]);

    axios.post('your route',formaData,{

    onUploadProgress:function(e){

        progressPercent=(e.loaded/e.total)*100

    }

})

}).then(response=>console.log(response.data))  

من آپلود رو رو change گذاشتم شما روی هر event دیگه ای میتونید انجام بدید.فقط input رو داخل یک فرم با enctype=multipart/form-data باید قرار داده باشید.در ضمن axios رو که در کد استفاده کردم صرفا یک کتابخونه است که میتونید اون رو دانلود کرده و استفاده کنید که پیشنهاد میکنم اگه از jquery استفاده میکنید بره آپلود فایل از این کتابخونه استفاده نکنید کا رو براتون سخت میکنه و axios بهترین گزینه است سبکم هست.

Dropzone دقیقا همین کار رو انجام میده
منتها به صورت پیش‌فرض وقتی فایل رو سلکت کنی خودش آپلود میکنه
برای تغییر این موضوع باید تنظیماتش رو سِت کنی

توی فروم سرچ کنی.. تاپیک های جالبی هست

سلام.
می تونی فایل هاتو با روشی که دوستمون در بالا گفتن آپلود کنی و بعد از آپلود اسم فایل که در سرور ذخیره شده رو به صفحه برگردونی و در یک input با تایپ hidden ذخیره کنید و هنگامی که کاربر دکمه ثبت رو می زنه اون اسم ها رو توی دیتابیس ذخیره کنید . بعد هم می تونی یه cronjob بنویسید تا مثلا هر روز فایل هایی که توی سرور هستن ولی توی دیتابیس هستن رو حذف کنه تا اگر کاربر فایل رو آپلود کرد و صفحه رو بست فایل اضافی توی سرور نباشه