CODEWITHSUNDEEP
javascriptphp
Ban Tot
Ban Tot

Reputation: 367

Display the image inserted in mysql using php and javascript?

I am trying to Display an image inserted on my database with a longblob data type. But it does not actually returns the expected output. No images has been shown on my form. And this is what I get on the php script. enter image description here

Also, this is the code I am working with:

PHP:

<?php
    include_once('pConfig.php');
    if (!isset($cID)){
        $cID = filter_input(INPUT_GET, "cIDs");
    }   
    if (!isset($ciCODe)){
        $ciCode = filter_input(INPUT_GET, "ciCodes");
    }
    $stmt = $db->prepare("SELECT * FROM ci_images WHERE ci_ID = ? AND ciCode = ?");
    $stmt->bind_param('is', $cID , $ciCode);
    $stmt->execute();
    $result = $stmt->get_result();
    if (!$result) {
        printf("Error: %s\n", mysqli_error($db));
        exit();
    }
    $json = mysqli_fetch_all($result, MYSQLI_ASSOC);
?>

JAVASCRIPT:

function previewImages(cID){
        var ciCode = window.localStorage.getItem('ciCode');
        var xdata = ({'cIDs': cID, 'ciCodes': ciCode });
        $.ajax({
        type: 'GET',
        url: '../back_php_Code/pPrevImages.php',
        dataType: 'json',
        data: xdata,
        contentType: 'application/json; charset=utf-8',
        success: function (response) {
                var cells = eval(response);s
              for (var i=0; i < cells.length ; i ++){
                    $('#iSet').append('<div class="col-lg-4 col-sm-6">'
                    + '<div class="thumbnail">'
                    + '<div class="thumb">'
                    + '<a href="'+ cells[i].Image + '" data-lightbox="9" data-title="' + cells[i].Title + '">'
                    + '<img src="'+ cells[i].Image + '" alt="" class="img-fluid img-thumbnail">'
                    + '</a>'
                    + '</div></div></div>');            
            }
        },
         error: function (error) {
            console.log(error);
        }
   });  
}

I hope someone can help me to do the trick in here, i've been stuck on this on a week. Thank you and Regards

UPDATE:

Result Answer 1

database fields

DBFields

Upvotes: 1

Views: 70

Answers (1)

tom
tom

Reputation: 10529

Echo your php result. Put this at the end of php file:

echo json_encode($json);

And to display an image blob in that way you try it, you should encode the blob

base64_encode($yourBlob)

send it back to your front-end and inject it to the img src attribute.

<img src="data:image/jpeg;base64,' + dataEncoded + '>

Upvotes: 2

Related Questions