Display signature image in email
Question
I was looking for a signature pad and came across a plugin by Thomas Bradley. I'm trying ti display the signature as an image in an email. All I get is an image code
Client signature:
[{"lx":69,"ly":44,"mx":69,"my":43},{"lx":68,"ly":43,"mx":69,"my":44},{"lx":68,"ly":44,"mx":68,"my":43},{"lx":69,"ly":48,"mx":68,"my":44},{"lx":72,"ly":55,"mx":69,"my":48},{"lx":77,"ly":67,"mx":72,"my":55},{"lx":85,"ly":82,"mx":77,"my":67},{"lx":90,"ly":96,"mx":85,"my":82},{"lx":93,"ly":107,"mx":90,"my":96},{"lx":95,"ly":114,"mx":93,"my":107},{"lx":97,"ly":117,"mx":95,"my":114},{"lx":98,"ly":117,"mx":97,"my":117},{"lx":102,"ly":113,"mx":98,"my":117},{"lx":110,"ly":102,"mx":102,"my":113},{"lx":120,"ly":86,"mx":110,"my":102},{"lx":131,"ly":68,"mx":120,"my":86},{"lx":139,"ly":53,"mx":131,"my":68},{"lx":143,"ly":48,"mx":139,"my":53},{"lx":145,"ly":47,"mx":143,"my":48},{"lx":147,"ly":49,"mx":145,"my":47},{"lx":154,"ly":55,"mx":147,"my":49},{"lx":159,"ly":62,"mx":154,"my":55},{"lx":161,"ly":68,"mx":159,"my":62},{"lx":162,"ly":73,"mx":161,"my":68},{"lx":162,"ly":75,"mx":162,"my":73},{"lx":162,"ly":74,"mx":162,"my":75},{"lx":166,"ly":66,"mx":162,"my":74},{"lx":173,"ly" :53,"mx":166,"my":66},{"l x":180,"ly":37,"mx":173,"my":53},{"lx":182,"ly":27,"mx":180,"my":37},{"lx":182,"ly":23,"mx":182,"my":27},{"lx":178,"ly":31,"mx":182,"my":23},{"lx":169,"ly":45,"mx":178,"my":31},{"lx":163,"ly":59,"mx":169,"my":45},{"lx":161,"ly":66,"mx":163,"my":59},{"lx":163,"ly":68,"mx":161,"my":66},{"lx":170,"ly":64,"mx":163,"my":68},{"lx":183,"ly":55,"mx":170,"my":64},{"lx":205,"ly":43,"mx":183,"my":55},{"lx":230,"ly":32,"mx":205,"my":43},{"lx":267,"ly":22,"mx":230,"my":32},{"lx":300,"ly":12,"mx":267,"my":22},{"lx":307,"ly":9,"mx":300,"my":12},{"lx":308,"ly":8,"mx":307,"my":9}]
PHP Code:
<?php
require_once("session.php");
require_once("class.user.php");
$auth_user = new USER();
$user_id = $_SESSION['user_session'];
$stmt = $auth_user->runQuery("SELECT * FROM users WHERE user_id=:user_id");
$stmt->execute(array(":user_id"=>$user_id));
$userRow=$stmt->fetch(PDO::FETCH_ASSOC);
if ($_POST['submit']) {
if (!$_POST['output']) {
$error = "<br>- Please enter your signature!";
}
if ($error) {
$result = "<div class='alert alert-danger' role='alert'>Whoops, there is an error. Please correct the following: $error</div>";
} else {
mail("albetws@gmail.com", "Request form", "From: ".$_POST['username']."
Message: ".$_POST['message']."
Client signature: ".$_POST['output']);
{
$result = "<div class='alert alert-success text-center' role='alert'>
<p>Thank you for your request.</p>
<p>No request conformation within 1 hr call the receiver</p>
<p>Please <a href='logout.php?logout=true'>Logout</a>.</p>
</div>";
}
}
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<title>Title</title>
<!-- Bootstrap -->
<link href="signature/assets/jquery.signaturepad.css" rel="stylesheet">
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/style.css">
<!--[if lt IE 9]><script src="../assets/flashcanvas.js"></script><![endif]-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script>
</head>
<body>
<section>
<div class="container">
<div class="row">
<div class="col-xs-12 col-sm-4 col-sm-offset-4">
<h2 class="text-center">Client Approval</h2>
<p class="text-center"><a href="option.php">Return to Main Menu </a> / <a href="logout.php?logout=true">Logout</a></p>
<?php echo $result;?>
<form action="" method="post" role="form" class="sigPad">
<p class="drawItDesc">Insert signature in the box below.</p>
<div class="sig sigWrapper">
<canvas class="pad" height="150"></canvas>
<input type="hidden" name="output" class="output">
</div>
<div class="form-group input-group btn-margin">
<span class="input-group-addon">
<span class="glyphicon glyphicon-remove"></span>
</span>
<input type="button" name="clear" class="form-control btn btn-primary clearButton" value="Clear signature">
</div>
<div class="form-group input-group btn-margin">
<span class="input-group-addon">
<span class="glyphicon glyphicon-send"></span>
</span>
<input type="submit" name="submit" class="form-control btn btn-primary" value="Submit signature">
</div>
</form>
</div>
</div>
</div>
</section>
<script src="signature/jquery.signaturepad.js"></script>
<script>
$(document).ready(function() {
var options = {
defaultAction: 'drawIt',
drawOnly: true,
lineTop: 135,
lineMargin: 20,
penColour: '#000'
}
$('.sigPad').signaturePad(options);
});
</script>
<script src="signature/assets/json2.min.js"></script>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script>
</body>
</html>
Thank you
1 answers
solution1
-2 2016-09-17 13:48:30
我在github.com网站上的MIT许可证下使用了小巧的时间，因为szimek pad签名，否则我在您的代码中看不到保存图像的格式。
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.