Save picture to ViewModel

[Patryk]

How do I save a picture of a control to a view model (to later save it to a database or FTP server, for example) rather than on a user's computer?

BTW

When will it be available in the EJ2 version?

[Shameer Ali Baig Sulaiman Ali Baig]

Hi Patryk, 

Greetings from Syncfusion support. 

  

Query 1: How do I save a picture of a control to a view model (to later save it to a database or FTP server, for example) rather than on a user's computer? 

 

We have prepared simple sample of saving the Signature into a SQL DB which meets your requirement.    

  

Sample : http://www.syncfusion.com/downloads/support/forum/143807/ze/SignatureCoreApplication-1228274314_(3)-597400197  

 

Please find the below KB link and sample for more references.  

 

KB Link: https://www.syncfusion.com/kb/7234/how-to-store-and-retrieve-a-signature-content-in-sql-database  

 

API reference: https://help.syncfusion.com/api/js/ejsignature  

  

Please check the shared sample and let us know if you need any further assistance.     

Query 2: 

 

When will it be available in the EJ2 version? 

 

Thank you for requesting this feature. Feature requests like yours are a key part of our ongoing product growth efforts. This feature is already included in our feature request database and here’s the link to the feature report page 

 

 

https://www.syncfusion.com/feedback/3889/signature-component   

 

If the definition of this feature corresponds to your requirement, please vote for it here. 

 

 

At the planning stage for every release cycle, we review all open features and identify features for implementation based on specific parameters including product vision, technological feasibility, and customer interest.  

 

We will let you know when this feature is implemented.  

 

Regards, 

Shameer Ali Baig S. 

[Patryk]

Thank you for your response.

I need to save the signature image to the property object in ViewModel. Please only such example.

[Christopher Issac Sunder K]

Hi Patrick, 

Good day to you!! 

For your information, the expected functionality is already available with the last provided sample in our previous update. Anyhow, we have now modified the sample to save the uploaded signature in property model object in the code behind as per your expectations. Please, refer the below code snippet and sample from below to achieve your requirement. 

Sample: http://www.syncfusion.com/downloads/support/forum/143807/ze/SignatureCoreApplication398671722  

 

[index.cshtml] 

@{ 

    ViewData["Title"] = "Signature"; 

} 

 

<h3>Sign here</h3> 

 

<div class="frame"> 

    <ej-signature id="mysign" height="400px" width="500" stroke-width="3" is-responsive="true" /> 

    <input id="btnUpload" type="button" value="UploaddatatoDB" onclick="Uploaddata()" /> 

</div> 

<script> 

 

 

    function Uploaddata() { 

 

        var target1 = $("#mysign").ejSignature("instance")._canvas[0].toDataURL() 

        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("Upload", "Home")', 

            data: { 

                target: newimage 

                }, 

 

                success: function (data) { 

                    alert("success" ); 

                } 

            }); 

    } 

 

</script> 

[SignatureContext.cs] 

public class SignatureTask 

    { 

 

        public string DataValue { get; set; } 

 

        public string SaveValueObject { get; set; } 

 

    } 

[HomeController.cs] 

[HttpPost] 

        public IActionResult Upload(string target) 

        { 

            SignatureTask obj = new SignatureTask(); 

            // Saving the signature value in model object 

            obj.SaveValueObject = target; 

            return View(); 

        } 

Please, let us know if you need any further assistance. 

Thanks, 

Christo