Geek Answers Handbook

How to save dynamically generated image in my database?

I have an HTML page that captures the user signature as SVG. I convert it to a page in .png and put it in the image container.

How can I use this to go to the database? I know how to do this using: <input type="file" /> , but I don't know how to pass the <img /> element to PHP.

This changes my SVG to PNG

  $("#save").click(function(){ var datapair = sigdiv.jSignature("getData", "svg"); var i = new Image(); i.src = "data:" + datapair[0] + "," + datapair[1]; $(i).appendTo($("#outputSvg")); var canvas = document.getElementById("canvas"); canvg(canvas, datapair[1]); var img = canvas.toDataURL("image/png"); $("#outputRaster").append("<img src='"+img+"'/>"); });

How to take the <img /> that I generate in <div id='outputRaster'> and pass it to my PHP? I know how to put it in a database, it’s just getting an image from my view level to my PHP page, which is used only to access data.

Any help or advice would be greatly appreciated!

0
source share
3 answers

Save the image as a file. Save the file path in your database.

Leon

+3
source

If you are talking about the image itself, look at the BLOB (they denote binary large objects). This is a way to store binary large data in a database.

If you talk about these tags, you would save them like any other text.

0
source

Suppose you need to save the path to the image (your image is stored on the server or you use it from the Internet.)

  $("#save").click(function(){ var datapair = sigdiv.jSignature("getData", "svg"); var i = new Image(); i.src = "data:" + datapair[0] + "," + datapair[1]; $(i).appendTo($("#outputSvg")); var canvas = document.getElementById("canvas"); canvg(canvas, datapair[1]); var img = canvas.toDataURL("image/png"); $("#outputRaster").append("<img src='"+img+"'/>"); imageTag = "<img src='"+img+"'/>"; //$.ajax( {url : yourUrl , data: imageTag} ); });

if you need to upload an image using jQuery you read in this article: link

0
source

More articles:


All Articles