Показать Exixting изображения из базы данных с Dropzone Js и Codeigniter 3 - PullRequest
Новая
       21

Показать Exixting изображения из базы данных с Dropzone Js и Codeigniter 3

0 голосов
/ 03 мая 2020

Я хочу показать данные изображения из базы данных с помощью dropzone Js, чтобы редактировать файл изображений

У меня есть вид в CI 3, например: 

<form action="<?= base_url('master/editItem'); ?>" method="POST">
<div class="form-group row">
    <label for="price_unit" class="col-sm-2 col-form-label">Images</label>
    <div class="col-sm-7">
        <form action="<?= base_url('master/editItem') ?>" class="dropzone" id="my-dropzone"></form>
        Please check data item before uploading file!
        <div class="dropzone" id="imagesDropzone">
            <div class="dz-message">
                <h3>Drop Images in Here!</h3>
            </div>
        </div>
    </div>
</div>
<div class="form-group row">
    <div class="col-sm-2"></div>
        <div class="col-sm-10">
        <a href="<?= base_url(); ?>master/list-items" class="btn btn-danger float-left"><i class="fas fa-undo-alt"></i> Back</a>
        <button type="submit" class="btn btn-success float-left ml-2" id="itemAdd">Update Data</button>
    </div>
</div>

Это моя функция в контроллере: 

function upload_images()
{

    $config['upload_path']   = FCPATH . '/upload-images/';
    $config['allowed_types'] = 'jpg|png|jpeg|bmp';
    $this->load->library('upload', $config);

    if ($this->upload->do_upload('userfile')) {
        $item_code = $this->input->post('item_code');
        $images_name = $this->upload->data('file_name');
        $this->db->insert('images', array('image_name' => $images_name, 'item_code' => $item_code));
    }
}


function remove_images()
{

    //get token images
    $item_code = $this->input->post('item_code');


    $images = $this->db->get_where('images', array('item_code' => $item_code));


    if ($images->num_rows() > 0) {
        $result = $images->row();
        $images_name = $result->images_name;
        if (file_exists($file = FCPATH . '/upload-images/' . $images_name)) {
            unlink($file);
        }
        $this->db->delete('images', array('item_code' => $item_code));
    }


    echo "{}";
}

И моя функция dropzone js: 

Dropzone.autoDiscover = false;

var images_upload = new Dropzone(".dropzone", {
url: "<?= base_url('master/upload_images') ?>",
dictDefaultMessage: "Drag and Drop Images or click",
maxFilesize: 2,
maxFiles: 3,
method: "post",
acceptedFiles: "image/*",
paramName: "userfile",
thumbnailWidth: 45,
thumbnailHeight: 45,
dictInvalidFileType: "This type doesn't support!",
addRemoveLinks: true,
});



//preparation upload and create token for photo
images_upload.on("sending", function(a, b, c) {
   a.token = $("#item_code").val();
   c.append("item_code", a.token);
});


images_upload.on("removedfile", function(a) {
var token = a.token;
$.ajax({
    type: "post",
    data: {
        token: token
    },
    url: "<?php echo base_url('master/remove_images') ?>",
    cache: false,
    dataType: 'json',
    success: function() {
        console.log("Images Deleted!");
    },
    error: function() {
        console.log("Error Removing Images!");

    }
  });
});

как отобразить данные изображения, которые уже существуют в базе данных, и в соответствии с выбранным элементом данных? Например, в одном элементе есть 3 изображения, и я хочу изменить изображение, используя dropzone js. Но я не знаю с чего начать. Я прошу вашей помощи. пример из моего дизайна редактировать элемент данных: enter image description here

...