amir najdi

مشکل در نمایش پیش نمایشی از تصاویر قبل از آپلود

amir najdi ۱۳۹۷/۱۰/۰۱ مباحث عمومی برنامه‌نویسی

سلام دوستان

من می خواهیم وقتی کاربر می خواد عکسیو آپلود کنه اول یک پیشنمایشی از عکش بهش نشون داده بشه ولی یک مشکلی که هست اینه که وقتی از بین عکس هایی که پیشنمایش نشون دادم یکی رو حذف کرد از input file حذف نمیشه و وقتی submit زد همه ی عکس ها ارسال میشه. ممنون میشم کمک کنید.

اینم کد javascript که از اینترنت پیدا کردم:

(function ($) {
    $(document).ready(function () {
        uploadImage()

        function uploadImage() {
            var button = $('.images .pic')
            var uploader = $('#image')
            var images = $('.images')
            var count = 0;
            button.on('click', function () {
                uploader.click()
            })

            uploader.on('change', function () {
                for (var i = 0; uploader[0].files.length && i<2; i++) {
                        var reader = new FileReader();
                        reader.onload = function (event) {
                            images.prepend('<div class="img" style="background-image: url(\'' + event.target.result + '\');" rel="' + event.target.result + '"><span>remove</span></div>');
                        }
                        reader.readAsDataURL(uploader[0].files[i])
                }
            })

            images.on('click', '.img', function () {
                $(this).remove()
            })

        }
    })
})(jQuery)
پاسخ‌ها به این تاپیک
سید جعفر اسمعیلی
سید جعفر اسمعیلی طراح و توسعه دهنده وب
۱۳۹۷/۱۰/۰۵

دوست عزیز شما  می تونید یه (input) تعریف کنید به صورت مخفی (hidden) بعد تصاویر و فایل های که کاربر انتخاب کرده آدرسشون رو بریزید توی اون هر کدوم رو که کاربر حذف کرد

از داخل اون حذف کنید و بعد مو قع ارسال به سمت سرور می تونید از ajax  استفاده کنید. الان تو کد های شما تصاویری که دریافت می کنید با جاوا اسکریپت همون حذف می کنید ولی اون input اولی رو ارسال می کنید واسه همین همه ای تصاویر ارسال می شن.