2X faster development
The ultimate ASP.NET MVC UI toolkit to boost your development speed.
DescriptionThe Signature control by default records the drawn signature in Base64 string format for later regeneration. Hence, we can use this to store in folder in your application. SolutionTo store the drawn signature image in the application folder, follow the steps below:
The following code explains how to store signature image to a folder in an application.
<div class="frame"> @Html.EJ().Signature("mysign").Height("400px").StrokeWidth(3).IsResponsive(true) <input type="button" id="btnSave" name="btnSave" value="Save" /> </div> <script> $(function () { // function on button click to convert the image to Base64 string value and then passing it to the server side $("#btnSave").click(function () { var div = $("#mysign"); var canvas = div["children"]()[0]; image = canvas.toDataURL("image/png"); newimage = image.replace('data:image/png;base64,', ''); $.ajax({ type: 'POST', url: '@Url.Action("SignatureSave", "Signature")', data: { imageData: newimage }, success: function (data) { alert("success" ); } }); }); }); </script>
// method to get the signature content and then store in a folder static string path = @"C:\Users\David\Desktop\SignatureMVC\App_Data\"; // give your folder in the application for storing [HttpPost] public ActionResult SignatureSave(string imageData) { string fileNameWitPath = path + DateTime.Now.ToString().Replace("/", "-").Replace(" ", "- ").Replace(":", "") + ".png"; using (FileStream fs = new FileStream(fileNameWitPath, FileMode.Create)) { using (BinaryWriter bw = new BinaryWriter(fs)) { byte[] data = Convert.FromBase64String(imageData); bw.Write(data); bw.Close(); } } return View(); }
The below is the screenshot of the image stored in the folder by using the above codes |
2X faster development
The ultimate ASP.NET MVC UI toolkit to boost your development speed.
This page will automatically be redirected to the sign-in page in 10 seconds.