Я пытаюсь использовать приложение для рисования, найденное здесь:
https://github.com/brinley/jSignature/
Ситуация:
Панель редактирования, где можно рисовать изображения
Кнопка, которая извлекает изображение и отправляет изображение AJAX в другой файл
Второй файл выбирает изображение и записывает его как файл.
Поле подписи работает просто отлично. Однако извлечь данные и отправить их в другой файл не удастся.
function GetCanvasContents() {
var datapair = $("#signature").jSignature("getData", "svgbase64")
var i = new Image()
i.src = "data:" + datapair[0] + "," + datapair[1]
$(i).appendTo($("#displayarea"))
var SetImage = $("#frameDemo").contents();
SendSignatureImage(SetImage);
}
function SendSignatureImage(Image) {
///######## SENDING THE INFORMATION BY AJAX
$.ajax({
type: "POST", ///######## SEND TYPE
url: "fetchimage.php", ///######## TARGET FILE TO RETRIEVE INFORMATION
data: {
'image': Image
},
///######## IN CASE OF SUCCESS
success: function (response) {
if (response == "ok") {
alert("correct");
}
else {
alert("Response = " + response);
}
}
}
);
}
HTML-код:
<div>
<div id="content">
<button name="GetContents" onclick="GetCanvasContents();">Get contents</button>
<div id="signatureparent">
<div id="signature">
</div>
</div>
<div id="tools"></div>
<div><p>Display Area:</p><div id="displayarea"></div></div>
</div>
<div id="scrollgrabber"></div>
</div>
Вам нужно будет отправить XML-строку в кодировке base64, которая находится в вашей переменной datapair [1], на страницу PHP, а затем преобразовать ее в изображение на стороне сервера в PHP.
Других решений пока нет …