Как показать изображение из базы данных с помощью ajax в Codeigniter

Question

Я хочу отобразить изображение из базы данных в теге «img» с помощью Ajax.

 <div class="col-md-3">
    <div class="form-group">
       <label for="EditcontactNoSelector">Employee Picture</label>
         <img src="" id="EditImage" alt="Not Found">
    </div>
 </div>

Это код Ajax, который идет к «master_get_employees» и выбирает путь к изображению из базы данных.Теперь я не знаю, как отобразить это изображение в теге «Img»?

 $(".Edit-modal").on("shown.bs.modal", function (e) {
           var button = $(e.relatedTarget); // Button that triggered the modal
           var ID = button.parents("tr").attr("data-id");
           var modal = $(this);
           console.log(ID);
           $.ajax({
              url: "'.base_url().'Employees/master_get_employees",
              data: {ID:ID},
              type: "POST",
              success:function(output){
                try{
                   modal.find("input#EditImage").val(outputData.pic);
             enabled=outputData.IsEnabled;
                        if(enabled=="1")
                        {
                        modal.find("#editIsEnabled").prop("checked",true);
                        }else if(enabled=="0"){
                        modal.find("#editIsEnabled").prop("checked",false);
                        }
                }
                catch(ex){
                    var split = output.split("::");
                    if(split[0] === "FAIL"){
                        Shafiq.notification(split[1],split[2])
                    }else{
                        Shafiq.notification("Could Not Load Data, Please Contact System Administrator For Further Assistance","error");
                    }
                }
              }
           });
    });

А вот функция «master_get_employees», где принимается запрос Ajax и данные извлекаются из базы данных.

function master_get_employees()
    {
        if ($this->input->post()) { //If Any Values Posted
            if ($this->input->is_ajax_request()) { //If Request Generated From Ajax
                $ID = $this->input->post('ID');
                if (!isset($ID) || !is_numeric($ID)) {
                    echo "FAIL::Something went wrong with POST request, Please contact system administrator for further assistance::error";
                    return;
                }
                $table = "employees e";
                $selectData = "e.id AS e.Picture as pic";
                $joins=array(
                    array(
                        "table"=>'designation d',
                        "condition"=>'d.id=e.Designation',
                        "type"=>'left',

                    ), array(
                        "table"=>'shifts s',
                        "condition"=>'s.id=e.shift',
                        "type"=>'left',

                    ));
                $where = array(
                    'e.id' => $ID, 'e.IsActive' => 1
                );
                $result = $this->Common_model->select_fields_where_like_join($table, $selectData,$joins, $where, TRUE);
                print json_encode($result);
            }
        }
    }

Answer 1

Измените эту строку

modal.find("input#EditImage").val(outputData.pic);

на

$("#EditImage").src('data:image/png;base64,'+outputData.pic);

ОБНОВЛЕНИЕ

Если ваши данные хранятся в виде двоичного двоичного объекта, то вывероятно, сначала нужно кодировать base64.

 $result['pic'] = 'data: '.mime_content_type($result['pic']).';base64,'base64_encode($result['pic']);

Затем все, что вам нужно сделать, это поместить его в src тега изображения.

Предполагая, что элемент pic закодирован в base64данные изображения, и изображение является PNG.

Answer 2

Вы можете использовать base64 image uri для достижения этой цели.Пожалуйста, обратитесь https://css -tricks.com / data-uris / для получения дополнительной информации

Answer 3

Вы можете показать изображение, используя следующее при успешном вызове ajax

$("#EditImage").attr('src', outputData.pic);