2016-10-14 2 views
1

JS 및 Jquery와 HTML 캔버스를 사용하는 서명 캡처 스크립트가 있습니다.POST 데이터 함수에서 가져온

서명을 처리하여 PNGURL을 통해 IMAGE/PNG로 변환 중입니다. 내가 뭘하고 싶습니다 POST 결과 PNGURL 반환하는 것입니다 ..하지만 문제가 있습니다. 저는 JS에 익숙하지 않지만 약 2 일 동안이 작업을 해왔습니다. 내가 숨겨진 데이터를 게시하는 데 문제가 있습니다. 페이지가 게시되고 다음 페이지로 전달되지만 hiddenDataURL은 비어 있습니다. 나는 서명이 PNGURL로 적절하게 변환되고 있음을 보여주는 경고 메시지로 JS를 테스트했지만 숨겨진 양식 요소로 올바르게 돌아 가지 않거나 signatureaccepted.php 페이지에 제대로 게시하지 않는 것입니다. 어떤 도움이라도 대단히 감사하겠습니다.

여기 내 두 페이지가 있습니다.

JS가 별도의 페이지에 있습니다.

function signatureSave() { 

    var canvas = document.getElementById("newSignature"); // save canvas image as data url (png format by default) 
    var dataURL = canvas.toDataURL("image/png", 0.1); 
    document.getElementById("hiddenDataURL").value = dataURL; 
    document.getElementById("hiddenForm").submit(); 

}; 

및 게시하려는 HTML 양식

<!DOCTYPE html> 
<html> 

<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 

    <script src="todataurl.js"></script> 
    <script src="signature.js"></script> 

</head> 

<body> 

    <div id="canvas"> 
     <canvas class="roundCorners" id="newSignature" style="position: relative; margin: 0; padding: 0; border: 1px solid #c4caac;"></canvas> 
    </div> 

    <script> 
     signatureCapture(); 
    </script> 
    <form id="hiddenForm" action="signatureaccepted.php" method="POST"> 
     <input type="hidden" id="hiddenDataURL" /> 

    </form> 

    <button type="button" onclick="signatureSave()">Sign Out</button> 

    <button type="button" onclick="signatureClear()"> 
       Clear signature 
      </button> 
    </br> 
    Saved Image 
    </br> 
    <img id="saveSignature" alt="Saved image png" /> 

</body> 

</html> 
+0

js에 대한 개발자 콘솔과 php에 대한 오류보고 http://php.net/manual/en/function.error-re porting.php 무엇인가와 주셔서 감사합니다. –

+0

아무 것도 아니야 : ( –

+0

메신저가 어떻게 그 구멍을 제출했는지 보려고 했어. –

답변

1

귀하는이 양식 제출하도록하지는 ID와 같을 필요는 않습니다

<form id="hiddenForm" action="signatureaccepted.php" method="POST"> 
    <input type="hidden" id="hiddenDataURL" name="hiddenDataURL"/> 

</form> 

제출하세요 이름 속성을 가지고 입력이 필요하지만, 이 경우에는 변경 사항이 가장 적음을 의미합니다.

+0

오, 이런. 많은 고마워, 너는 내 영웅이야. 만약 내가 대머리가 아니라면, 내 머리카락을 꺼내 ​​겠어. 매우 작음 –

+1

'Cant는 그렇게 작은 것을 믿습니다. '그녀가 말한 것 : p –

+1

지난 며칠 동안 우리는 모바일 장치에서 손으로 그려진 이미지를 보내는 일과 관련하여 아이디어를 가지고 놀고있었습니다. 오늘이 문제에 대한 첫 번째 질문은 마우스/터치 코드 코딩에 많은 시간을 할애했기 때문에 승/이길 수 있습니다. –