Bootstrap Modal с загрузкой файлов не показывает загруженные изображения в браузере: / - PullRequest
0 голосов
/ 03 октября 2019

Мой модал загрузки изображений не работает должным образом. Когда я нажимаю на кнопку загрузки изображения модального, изображение отлично сохраняется на моем сервере. Но загруженное изображение не появляется в модале после загрузки ... Мне нужно, чтобы изображение появилось в модале (сразу после загрузки) для выбора. Если я очищаю кеш браузера и удаляю все куки, загруженные изображения затем отображаются, как и должно быть в модальном режиме. Но я не могу очистить кэш браузера после каждой загрузки изображения, чтобы иметь возможность выбрать загруженное изображение ... Это действительно неловко. Я думаю, что-то не хватает в моих кодах get_files.php. Я поделюсь всеми кодами ниже. Пожалуйста, пожалуйста, пожалуйста, помогите мне решить это ... Большое спасибо заранее. Хорошего дня !

Я перепробовал много изменений в файлах php и js, но ни один из них не работал: (

Вот URL-адрес видео, показывающий проблему: «Новые загруженные изображения не отображаются в модальном режиме, еслиКэш браузера не очищен ': http://kartella.com.tr/modal.mp4

<!--Get-Files.php-->

<?php
include_once 'config.php';

//get all files in uploads folder
$files = array_diff(scandir(UPLOADS_DIRECTORY), array('.', '..'));

//creating response
$response=array();

$response['code']=0;
$response['files']=$files;
$response['directory']=UPLOADS_URL;

//convert to json
echo json_encode($response);
?>

---JS Codes---

//load all uploads files from server
function loadImages() {
    /*<div class="col-sm-4">
      <img src="fd" alt='' data-url=''>
     </div>*/
    $.ajax({
        url: 'get-files.php',
        type: 'GET',
        dataType: 'json',
        success: function(data) {
            if (data.code == 0) {
                _output = '';
                for (var k in data.files) {
                    if (typeof data.files[k] !== 'function') {
                        _output += "<div class='col-sm-3'>" +
                            "<img class='upload-image-item' src='" + data.directory + data.files[k] + "' alt='" + data.files[k] + "' data-url='" + data.directory + data.files[k] + "'>" +
                            "</div>";
                        // console.log("Key is " + k + ", value is" + data.files[k]);
                    }
                }
                $('.upload-images').html(_output);
            }
        },
        error: function() {}
    });
}

---PHP Codes---

onPopupUploadImageButtonClick: function() {
                console.log('onPopupUploadImageButtonClick html');
                var file_data = $('.input-file').prop('files')[0];
                var form_data = new FormData();
                form_data.append('file', file_data);
                $.ajax({
                    url: 'upload.php', // point to server-side PHP script
                    dataType: 'text', // what to expect back from the PHP script, if anything
                    cache: false,
                    contentType: false,
                    processData: false,
                    data: form_data,
                    type: 'post',
                    success: function(php_script_response) {
                        loadImages();
                    }
                });
            }

Я бы хотел, чтобы загруженные изображения появлялись в модале загрузки сразу после загрузки, без необходимости очистки кеша браузера.

...