显示来自ajax响应的图像

Question

I am getting response in jquery as below. I want to show images from the db through the ajax request. My controller code :

public function images($id='')
    {           
        $this->load->model('gallery');
        $data = this->gallery_model->getimages($this->input->post('id')); 
        echo json_encode($data);
    }

My ajax :

function imageslide(folderid){

$.ajax({
    url: "<?php echo site_url() ?>/welcome/images",
    type: "POST",
    dataType: "json",
    data: {id: folderid},
    success: function(result) {
      if(result){
        resultObj = eval (result);
        alert(JSON.stringify(resultObj));
      }else{
        alert("error");
      }
    }
});

The result which i received in the Network tab is

[{"id":"153","file_name":"DSC00081.JPG","created":"2017-05-23 09:36:32","modified":"2017-05-23 09:36:32","status":null,"folder_id":"50"},{"id":"154","file_name":"DSC00082.JPG","created":"2017-05-23 09:36:32","modified":"2017-05-23 09:36:32","status":null,"folder_id":"50"},{"id":"155","file_name":"DSC00083.JPG","created":"2017-05-23 09:36:32","modified":"2017-05-23 09:36:32","status":null,"folder_id":"50"}]

I do not know how to show image in the browser in the <img> tag. As you can see, I am getting jpeg in the alert window. Kindly help me through.. Thanks in Advance!

Answer 1

You have received JSON object in result. Just loop through it, using

$.each(result, function(key, value){ $('#container').append('<img src=" +value.file_name + " />'); })