Save jSign image to file using php

Setup jSign first
in head section of page

<!-- you load jquery somewhere above here ... -->
<!--[if lt IE 9]>
<script type="text/javascript" src="libs/flashcanvas.js"></script>
<![endif]-->

in body section

<form action="save-sign.php" method="post">
 Sign here
 <div id="signature"></div>
 <input type="hidden" name="hdnSignature" id="hdnSignature" />
 <input type="button" id="btn_submit" value="Submit Form" />
</form>

<script>
$(function () {
 'use strict';
 var $sigdiv = $("#signature");
 $sigdiv.jSignature();// inits the jSignature widget.
 
 //save data to hidden field before submiting the form
 $('#btn_submit').click(function () {
  var datapair = $sigdiv.jSignature("getData", "image");
  $('#hdnSignature').val(datapair[1]);
 //now submit form 

document.forms[0].submit();
  });
 });
</script>

and save-sign.php file should be like this

<?php
$sign = '';
if(isset($_POST['hdnSignature']))
{
 $sign = $_POST['hdnSignature'];
 $path = "path to file.png";
 $sign = base64_decode($sign); //convert base64
 file_put_contents($path, $sign); //save to file
 //all done
}
?>