最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - Signature Draw for phonegap - Stack Overflow

programmeradmin5浏览0评论

Sorry for asking this again but i didn't find the simple signature plugins in phonegap. I want to capture the signature for my phonegap application so i prepare to use this one link but it is not worked in phonegap but workrd in browsers please suggest any plugins or how to develop capture signaute in my phonegap application.

Sorry for asking this again but i didn't find the simple signature plugins in phonegap. I want to capture the signature for my phonegap application so i prepare to use this one link but it is not worked in phonegap but workrd in browsers please suggest any plugins or how to develop capture signaute in my phonegap application.

Share Improve this question asked Nov 29, 2013 at 7:06 ViniVini 9771 gold badge15 silver badges34 bronze badges 1
  • No one can help unless you share some code what you tried and what issue u get. – Purus Commented Nov 29, 2013 at 7:28
Add a ment  | 

2 Answers 2

Reset to default 4

I have done this signature capture using above Chintankethiya answer but I spend nearly one and half days to do this one in Phonegap. So here i put the sample of what I have done. It will be more helpfull for newers like me.

First you need to download the 1. jquery.signaturepad.css, 2.jquery.signaturepad.js and 3.json2.min.js from the Github link and implement the signature applicationn.

index.html:

 <html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title></title>
 <link href="jquery.signaturepad.css" rel="stylesheet">
<link rel="stylesheet" href="http://code.jquery./mobile/1.3.2/jquery.mobile-1.3.2.min.css" />
<script type="text/javascript" src="cordova.js"></script>
<script src="http://code.jquery./jquery-1.9.1.min.js"></script>
<script src="http://code.jquery./mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>
<script src="jquery.signaturepad.js"></script>



</head>

<body>

 <form method="post" action="" class="sigPad">
    <label for="name">Print your name</label>
    <input type="text" name="name" id="name" class="name">
    <p class="typeItDesc">Review your signature</p>
    <p class="drawItDesc">Draw your signature</p>
    <ul class="sigNav">
      <li class="typeIt"><a href="#type-it" >Type It</a></li>
      <li class="drawIt"><a href="#draw-it" class="current" >Draw It</a></li>
      <li class="clearButton"><a href="#clear">Clear</a></li>
    </ul>
    <div class="sig sigWrapper">
      <div class="typed"></div>
      <canvas class="pad" width="198" height="55" id="sigmy"></canvas>
      <input type="hidden" name="output" class="output">
    </div>
    <div><input type="button" value="Create" id="mysign" onclick="setImage();"></div>
    <button type="submit">I accept the terms of this agreement.</button>
     <img  width="198" height="55" id="sigmy1">
  </form>

  <script src="jquery.signaturepad.js"></script>
  <script>
   var a;
    $(document).ready(function() {
     $('.sigPad').signaturePad();
    });
    function setImage() {
    var a = $("#sigmy")[0];
    var b= a.toDataURL();
    document.getElementById("sigmy1").src=b;

    }
  </script>
  <script src="json2.min.js"></script>
</body>
</html>

Refer this one

Don't forget to include cordova.js and library and xml. We can do multiple signature also and filter either Draw or Print using this plugin. That's all the Signature app will be ready. Feel free to ask any doubts.

You have to just use some JQuery or JavaScript which can allow to draw signature & save your time to write your own code.

Check this Might be it will helpful to you.

发布评论

评论列表(0)

  1. 暂无评论