Call a blob data with ajax












0















I have a code, and this code call some datas of my MySql database and then show it in a <p>, it works perfectly, but when i want to call an image that is saved in a mediumblob type, it does not work.



Here's the code



Ajax.js



$(document).on("ready", function() {
$("#select").on("change", function(e) {
var option = $(this).val();
if(option.toLowerCase() !== "ninguno") {
var dataToSend = JSON.parse('{"name": "reference", "value": "'+option+'"}');
ajaxProcess(dataToSend);
} else {
$("p").each( function() {
$(this).html("");
});
}
});


function ajaxProcess(dataToSend) {
$.ajax({
url: "process.php",
dataType: "json",
data: dataToSend,
type: "get"
}
)
.done( function(data) {
$("#ram").html(data["ram"]);
$("#camara").html(data["camara"]);
$("#imagen").html(data["imagen"]); //Here's the problem
})
.fail( function(jqXHR,textStatus,errorThrown) {
console.log("Can´t get the data");
});
}
});


When i select the value in a combobox, it shows the error message "Can´t get the data"



Process.php



<?php

$connection = new mysqli("127.0.0.1","root","","labash");
$connection->set_charset("utf8");

if($connection->connect_errno)
throw new Exception("Error al conectar a la base de datos");

$stmt = $connection->stmt_init();
$query = "SELECT ram,camara,imagen FROM celulares WHERE reference=?";

if($stmt->prepare($query)) { // prepare the sentence
$name = $_GET["value"];
$stmt->bind_param("s", $name); //bind data
$stmt->execute(); // execute the sentence
$result = $stmt->get_result(); // get the result
$connection->close();
echo json_encode($result->fetch_assoc()); // get the data as JSON
}


In the html code i call the "ram" data (for example) in a <p id="ram"> and it works, but the image doesn´t.
Thanks Beforehand










share|improve this question

























  • What is imagen on your database.

    – RiggsFolly
    Nov 21 '18 at 20:09











  • You dont want to replace the html of an image you will want to replace the src="" attribute. So something like src='data:image/jpeg;base64,<!-- base64 data -->'

    – RiggsFolly
    Nov 21 '18 at 20:11











  • So something like $("#imagen").src('data:image/jpeg;base64,' + data["imagen"]);

    – RiggsFolly
    Nov 21 '18 at 20:12











  • @RiggsFolly imagen is the name of the column in the database where i save the image

    – Sebastian Sanchez
    Nov 21 '18 at 20:13











  • Yes I know that! What does it contain, a base64 encoded image I would assume

    – RiggsFolly
    Nov 21 '18 at 20:14


















0















I have a code, and this code call some datas of my MySql database and then show it in a <p>, it works perfectly, but when i want to call an image that is saved in a mediumblob type, it does not work.



Here's the code



Ajax.js



$(document).on("ready", function() {
$("#select").on("change", function(e) {
var option = $(this).val();
if(option.toLowerCase() !== "ninguno") {
var dataToSend = JSON.parse('{"name": "reference", "value": "'+option+'"}');
ajaxProcess(dataToSend);
} else {
$("p").each( function() {
$(this).html("");
});
}
});


function ajaxProcess(dataToSend) {
$.ajax({
url: "process.php",
dataType: "json",
data: dataToSend,
type: "get"
}
)
.done( function(data) {
$("#ram").html(data["ram"]);
$("#camara").html(data["camara"]);
$("#imagen").html(data["imagen"]); //Here's the problem
})
.fail( function(jqXHR,textStatus,errorThrown) {
console.log("Can´t get the data");
});
}
});


When i select the value in a combobox, it shows the error message "Can´t get the data"



Process.php



<?php

$connection = new mysqli("127.0.0.1","root","","labash");
$connection->set_charset("utf8");

if($connection->connect_errno)
throw new Exception("Error al conectar a la base de datos");

$stmt = $connection->stmt_init();
$query = "SELECT ram,camara,imagen FROM celulares WHERE reference=?";

if($stmt->prepare($query)) { // prepare the sentence
$name = $_GET["value"];
$stmt->bind_param("s", $name); //bind data
$stmt->execute(); // execute the sentence
$result = $stmt->get_result(); // get the result
$connection->close();
echo json_encode($result->fetch_assoc()); // get the data as JSON
}


In the html code i call the "ram" data (for example) in a <p id="ram"> and it works, but the image doesn´t.
Thanks Beforehand










share|improve this question

























  • What is imagen on your database.

    – RiggsFolly
    Nov 21 '18 at 20:09











  • You dont want to replace the html of an image you will want to replace the src="" attribute. So something like src='data:image/jpeg;base64,<!-- base64 data -->'

    – RiggsFolly
    Nov 21 '18 at 20:11











  • So something like $("#imagen").src('data:image/jpeg;base64,' + data["imagen"]);

    – RiggsFolly
    Nov 21 '18 at 20:12











  • @RiggsFolly imagen is the name of the column in the database where i save the image

    – Sebastian Sanchez
    Nov 21 '18 at 20:13











  • Yes I know that! What does it contain, a base64 encoded image I would assume

    – RiggsFolly
    Nov 21 '18 at 20:14
















0












0








0








I have a code, and this code call some datas of my MySql database and then show it in a <p>, it works perfectly, but when i want to call an image that is saved in a mediumblob type, it does not work.



Here's the code



Ajax.js



$(document).on("ready", function() {
$("#select").on("change", function(e) {
var option = $(this).val();
if(option.toLowerCase() !== "ninguno") {
var dataToSend = JSON.parse('{"name": "reference", "value": "'+option+'"}');
ajaxProcess(dataToSend);
} else {
$("p").each( function() {
$(this).html("");
});
}
});


function ajaxProcess(dataToSend) {
$.ajax({
url: "process.php",
dataType: "json",
data: dataToSend,
type: "get"
}
)
.done( function(data) {
$("#ram").html(data["ram"]);
$("#camara").html(data["camara"]);
$("#imagen").html(data["imagen"]); //Here's the problem
})
.fail( function(jqXHR,textStatus,errorThrown) {
console.log("Can´t get the data");
});
}
});


When i select the value in a combobox, it shows the error message "Can´t get the data"



Process.php



<?php

$connection = new mysqli("127.0.0.1","root","","labash");
$connection->set_charset("utf8");

if($connection->connect_errno)
throw new Exception("Error al conectar a la base de datos");

$stmt = $connection->stmt_init();
$query = "SELECT ram,camara,imagen FROM celulares WHERE reference=?";

if($stmt->prepare($query)) { // prepare the sentence
$name = $_GET["value"];
$stmt->bind_param("s", $name); //bind data
$stmt->execute(); // execute the sentence
$result = $stmt->get_result(); // get the result
$connection->close();
echo json_encode($result->fetch_assoc()); // get the data as JSON
}


In the html code i call the "ram" data (for example) in a <p id="ram"> and it works, but the image doesn´t.
Thanks Beforehand










share|improve this question
















I have a code, and this code call some datas of my MySql database and then show it in a <p>, it works perfectly, but when i want to call an image that is saved in a mediumblob type, it does not work.



Here's the code



Ajax.js



$(document).on("ready", function() {
$("#select").on("change", function(e) {
var option = $(this).val();
if(option.toLowerCase() !== "ninguno") {
var dataToSend = JSON.parse('{"name": "reference", "value": "'+option+'"}');
ajaxProcess(dataToSend);
} else {
$("p").each( function() {
$(this).html("");
});
}
});


function ajaxProcess(dataToSend) {
$.ajax({
url: "process.php",
dataType: "json",
data: dataToSend,
type: "get"
}
)
.done( function(data) {
$("#ram").html(data["ram"]);
$("#camara").html(data["camara"]);
$("#imagen").html(data["imagen"]); //Here's the problem
})
.fail( function(jqXHR,textStatus,errorThrown) {
console.log("Can´t get the data");
});
}
});


When i select the value in a combobox, it shows the error message "Can´t get the data"



Process.php



<?php

$connection = new mysqli("127.0.0.1","root","","labash");
$connection->set_charset("utf8");

if($connection->connect_errno)
throw new Exception("Error al conectar a la base de datos");

$stmt = $connection->stmt_init();
$query = "SELECT ram,camara,imagen FROM celulares WHERE reference=?";

if($stmt->prepare($query)) { // prepare the sentence
$name = $_GET["value"];
$stmt->bind_param("s", $name); //bind data
$stmt->execute(); // execute the sentence
$result = $stmt->get_result(); // get the result
$connection->close();
echo json_encode($result->fetch_assoc()); // get the data as JSON
}


In the html code i call the "ram" data (for example) in a <p id="ram"> and it works, but the image doesn´t.
Thanks Beforehand







php jquery ajax






share|improve this question















share|improve this question













share|improve this question




share|improve this question








edited Nov 21 '18 at 20:21









RiggsFolly

71.6k1866113




71.6k1866113










asked Nov 21 '18 at 20:04









Sebastian SanchezSebastian Sanchez

1




1













  • What is imagen on your database.

    – RiggsFolly
    Nov 21 '18 at 20:09











  • You dont want to replace the html of an image you will want to replace the src="" attribute. So something like src='data:image/jpeg;base64,<!-- base64 data -->'

    – RiggsFolly
    Nov 21 '18 at 20:11











  • So something like $("#imagen").src('data:image/jpeg;base64,' + data["imagen"]);

    – RiggsFolly
    Nov 21 '18 at 20:12











  • @RiggsFolly imagen is the name of the column in the database where i save the image

    – Sebastian Sanchez
    Nov 21 '18 at 20:13











  • Yes I know that! What does it contain, a base64 encoded image I would assume

    – RiggsFolly
    Nov 21 '18 at 20:14





















  • What is imagen on your database.

    – RiggsFolly
    Nov 21 '18 at 20:09











  • You dont want to replace the html of an image you will want to replace the src="" attribute. So something like src='data:image/jpeg;base64,<!-- base64 data -->'

    – RiggsFolly
    Nov 21 '18 at 20:11











  • So something like $("#imagen").src('data:image/jpeg;base64,' + data["imagen"]);

    – RiggsFolly
    Nov 21 '18 at 20:12











  • @RiggsFolly imagen is the name of the column in the database where i save the image

    – Sebastian Sanchez
    Nov 21 '18 at 20:13











  • Yes I know that! What does it contain, a base64 encoded image I would assume

    – RiggsFolly
    Nov 21 '18 at 20:14



















What is imagen on your database.

– RiggsFolly
Nov 21 '18 at 20:09





What is imagen on your database.

– RiggsFolly
Nov 21 '18 at 20:09













You dont want to replace the html of an image you will want to replace the src="" attribute. So something like src='data:image/jpeg;base64,<!-- base64 data -->'

– RiggsFolly
Nov 21 '18 at 20:11





You dont want to replace the html of an image you will want to replace the src="" attribute. So something like src='data:image/jpeg;base64,<!-- base64 data -->'

– RiggsFolly
Nov 21 '18 at 20:11













So something like $("#imagen").src('data:image/jpeg;base64,' + data["imagen"]);

– RiggsFolly
Nov 21 '18 at 20:12





So something like $("#imagen").src('data:image/jpeg;base64,' + data["imagen"]);

– RiggsFolly
Nov 21 '18 at 20:12













@RiggsFolly imagen is the name of the column in the database where i save the image

– Sebastian Sanchez
Nov 21 '18 at 20:13





@RiggsFolly imagen is the name of the column in the database where i save the image

– Sebastian Sanchez
Nov 21 '18 at 20:13













Yes I know that! What does it contain, a base64 encoded image I would assume

– RiggsFolly
Nov 21 '18 at 20:14







Yes I know that! What does it contain, a base64 encoded image I would assume

– RiggsFolly
Nov 21 '18 at 20:14














1 Answer
1






active

oldest

votes


















0














I solve it



First: I use a converter Base64 image



Then i copy the code and i save that code in the database



And here´s the new code of the Ajax.js file:



    $("#imagen").attr('src', data["imagen_encode"]);


imagen_encode is the new column of my table in the database. i paste all the code of the Base64 converter and save it in the imagen_encode column. And i call it in html <img id="imagen">






share|improve this answer























    Your Answer






    StackExchange.ifUsing("editor", function () {
    StackExchange.using("externalEditor", function () {
    StackExchange.using("snippets", function () {
    StackExchange.snippets.init();
    });
    });
    }, "code-snippets");

    StackExchange.ready(function() {
    var channelOptions = {
    tags: "".split(" "),
    id: "1"
    };
    initTagRenderer("".split(" "), "".split(" "), channelOptions);

    StackExchange.using("externalEditor", function() {
    // Have to fire editor after snippets, if snippets enabled
    if (StackExchange.settings.snippets.snippetsEnabled) {
    StackExchange.using("snippets", function() {
    createEditor();
    });
    }
    else {
    createEditor();
    }
    });

    function createEditor() {
    StackExchange.prepareEditor({
    heartbeatType: 'answer',
    autoActivateHeartbeat: false,
    convertImagesToLinks: true,
    noModals: true,
    showLowRepImageUploadWarning: true,
    reputationToPostImages: 10,
    bindNavPrevention: true,
    postfix: "",
    imageUploader: {
    brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
    contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
    allowUrls: true
    },
    onDemand: true,
    discardSelector: ".discard-answer"
    ,immediatelyShowMarkdownHelp:true
    });


    }
    });














    draft saved

    draft discarded


















    StackExchange.ready(
    function () {
    StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53419715%2fcall-a-blob-data-with-ajax%23new-answer', 'question_page');
    }
    );

    Post as a guest















    Required, but never shown

























    1 Answer
    1






    active

    oldest

    votes








    1 Answer
    1






    active

    oldest

    votes









    active

    oldest

    votes






    active

    oldest

    votes









    0














    I solve it



    First: I use a converter Base64 image



    Then i copy the code and i save that code in the database



    And here´s the new code of the Ajax.js file:



        $("#imagen").attr('src', data["imagen_encode"]);


    imagen_encode is the new column of my table in the database. i paste all the code of the Base64 converter and save it in the imagen_encode column. And i call it in html <img id="imagen">






    share|improve this answer




























      0














      I solve it



      First: I use a converter Base64 image



      Then i copy the code and i save that code in the database



      And here´s the new code of the Ajax.js file:



          $("#imagen").attr('src', data["imagen_encode"]);


      imagen_encode is the new column of my table in the database. i paste all the code of the Base64 converter and save it in the imagen_encode column. And i call it in html <img id="imagen">






      share|improve this answer


























        0












        0








        0







        I solve it



        First: I use a converter Base64 image



        Then i copy the code and i save that code in the database



        And here´s the new code of the Ajax.js file:



            $("#imagen").attr('src', data["imagen_encode"]);


        imagen_encode is the new column of my table in the database. i paste all the code of the Base64 converter and save it in the imagen_encode column. And i call it in html <img id="imagen">






        share|improve this answer













        I solve it



        First: I use a converter Base64 image



        Then i copy the code and i save that code in the database



        And here´s the new code of the Ajax.js file:



            $("#imagen").attr('src', data["imagen_encode"]);


        imagen_encode is the new column of my table in the database. i paste all the code of the Base64 converter and save it in the imagen_encode column. And i call it in html <img id="imagen">







        share|improve this answer












        share|improve this answer



        share|improve this answer










        answered Nov 21 '18 at 21:14









        Sebastian SanchezSebastian Sanchez

        1




        1
































            draft saved

            draft discarded




















































            Thanks for contributing an answer to Stack Overflow!


            • Please be sure to answer the question. Provide details and share your research!

            But avoid



            • Asking for help, clarification, or responding to other answers.

            • Making statements based on opinion; back them up with references or personal experience.


            To learn more, see our tips on writing great answers.




            draft saved


            draft discarded














            StackExchange.ready(
            function () {
            StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53419715%2fcall-a-blob-data-with-ajax%23new-answer', 'question_page');
            }
            );

            Post as a guest















            Required, but never shown





















































            Required, but never shown














            Required, but never shown












            Required, but never shown







            Required, but never shown

































            Required, but never shown














            Required, but never shown












            Required, but never shown







            Required, but never shown







            這個網誌中的熱門文章

            Xamarin.form Move up view when keyboard appear

            Post-Redirect-Get with Spring WebFlux and Thymeleaf

            Anylogic : not able to use stopDelay()