CODEWITHSUNDEEP
javascriptphpjquerycanvas
user3821544
user3821544

Reputation: 159

Save canvas as image into database with jquery and php

So, I'm wondering what I'm doing wrong in my code. I have a <canvas> element which can be drawn on. On mouseup jQuery pulls the data as an image and should then post it to PHP, which stores it in the database. It's not working though.

function print(){
    var canvas1 = document.getElementById("paint");
    var ctx1 = canvas1.getContext("2d");
    var img = canvas1.toDataURL("image/png");
    img = encodeURIComponent(img);

    $.ajax({
        url: 'poster.php',
        data: { data: img },
                type: 'post',
                success: function(data) {
                    console.log(data);
                }
    });

poster.php

<?php

    $data = $_POST['data'];

    $server = "localhost";
    $username = "root";
    $password = "root";
    $database = "canvas";
    $bd = mysql_connect($server, $username, $password) or die("1");
    $ok = mysql_select_db($database, $bd) or die("2");

    $sql = "INSERT INTO canvas (image) VALUES ($data)";
    $qry = mysql_query($sql);

    echo $qry;

?>

Upvotes: 1

Views: 1210

Answers (1)

Damilola Olowookere
Damilola Olowookere

Reputation: 2383

Do var_dump() in your poster.php script to see if your ajax is feeding it something. Then modify the following:

    $sql = "INSERT INTO canvas (image) VALUES ($data)";
    $qry = mysql_query($sql);

to:

    $sql = "INSERT INTO canvas (image) VALUES ($data)";
    if( ! mysql_query($sql) )
   {
       echo "Error: " . mysql_error();
   }

Maybe output from the above will show the way to go!

Upvotes: 1

Related Questions