Marine1969
IS-IT--Management
I tried this back in Jan and was never able to get this to work correctly. I suck with js so please be gentle. I found this script from unbolt it...
But it just says..."After the canvas image has been imported and saved into the database,...". And herein currently lies my issue. This script is part of a larger <form>. Is "$(document)." creating another <form>? What is the $_POST name to save the signature? I have a mysql db table field setup as TEXT to accept the data but currently the signature box is not even displaying!
I think I have read over 10 sites on how to do this and the less confusing ones I still cannot get to work. I want to understand what to do because I need to implement this in other places. A watered down script of the <form> is below...
jSignature.js is in the folder.
PHP:
<script language="JavaScript" type="text/javascript" src="jSignature.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#signature").jSignature({color:"#00f",lineWidth:5});
});
</script>
I think I have read over 10 sites on how to do this and the less confusing ones I still cannot get to work. I want to understand what to do because I need to implement this in other places. A watered down script of the <form> is below...
jSignature.js is in the folder.
PHP:
<script src="[URL unfurl="true"]https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>[/URL]
<script src="jquery-3.2.1.min.js"></script>
<form action="myrecords.php" method="POST">
<input type='text' name='blah1'>
<input type='text' name='blah2'>
<tr><td colspan="7">
<center><button type="button" onclick="$('#signature').jSignature('clear')">Clear</button></center>
<!-- <button type="submit" id="btnSave">Save</button> -->
<script language="JavaScript" type="text/javascript" src="jSignature.js"></script>
<script type="text/javascript">
$('#btnSave').click(function(){
var sigData = $('#signature').jSignature('getData','base30');
$('#hiddenSigData').val(sigData);
});
</script>
</td></tr>
<input type="submit" value="Save" style="width:300px;height:50px;">
</form>