jSignature を使用して、html フォームで署名を許可しています (正確には jQuery Mobile)。フォームで署名の画像を送信できるようにしたいと思います。
以下のコードで、最初のいくつかのステップを完了しました。正常に DataURI (data:image/png;base64,iVBOR...) を作成し、placesig 関数が呼び出されたときに非表示フィールド _fid_86 の値に追加します。
ヘルプが必要なこと: 1) DataURI を、送信時にフォーム データに含めることができる画像に変換するにはどうすればよいですか? 2) その画像を非表示の入力に接続するにはどうすればよいですか? 同じ方法で機能しますか、それともファイル入力である必要がありますか。
このフォームを Web アプリケーションから QuickBase に投稿しています。理想的には、サーバー側の関与なしでこれを達成できるようにしたいと考えています。これにより、アプリは自己完結型になり、php やその他のホストされたスクリプトに依存しなくなります。
それが不可能な場合は、php で実行できますが、それを実現する方法はまだわかりません。
私はこれに何日も費やしました。そして、プログラミングの知識が不足していることが原因であることはわかっています。これに対する解決策は、私にとって非常に大きなものです。
ありがとう!!
<body>
<script src="jquery-1.8.2.min.js"></script>
<script src="jquery.mobile-1.2.0.min.js"></script>
<script src="jSignature.js"></script>
</head>
<body>
<form name=qdbform method=POST onsubmit='return validateForm(this)' encoding='multipart/form-data'
encType='multipart/form-data' action=https://www.quickbase.com/db/...?act=API_AddRecord>
<script type="text/javascript">
var $sigDiv = null;
$(document).ready(
function()
{
$sigDiv = $("#signature1").jSignature({'UndoButton':false,color:"#000000",lineWidth:2});
}
);
function placesig()
{
var datapair = $sigDiv.jSignature("getData", "image");
var i = new Image();
i.src = "data:" + datapair[0] + "," + datapair[1];
var src = $(i).attr('src');
$("#_fid_86").val(src);
};
</script>
<div id="signature1"></div>
<input data-theme="a" type="button" value="Place Image" onclick="placesig();"/>
<input type="hidden" id="_fid_86" name="_fid_86" />
<input type="submit" value="Save">
</form>