Firma Digital en JetFormBuilder<\/title>\r\n <style>\r\n .signature-container {\r\n border: 1px solid #ccc;\r\n margin: 20px auto;\r\n padding: 10px;\r\n width: 100%;\r\n max-width: 400px;\r\n }\r\n canvas {\r\n border: 1px solid #000;\r\n cursor: crosshair;\r\n width: 100%;\r\n }\r\n button {\r\n margin: 5px;\r\n padding: 10px 20px;\r\n font-size: 16px;\r\n cursor: pointer;\r\n }\r\n img {\r\n max-width: 100%;\r\n height: auto;\r\n border: 1px solid #ccc;\r\n margin-top: 10px;\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n \r\n <div class=\"signature-container\">\r\n <canvas id=\"signatureCanvas\" width=\"400\" height=\"200\"><\/canvas>\r\n <br>\r\n <button id=\"clearButton\">Limpiar<\/button>\r\n <button id=\"saveButton\">Guardar Firma<\/button>\r\n <\/div>\r\n\r\n \r\n <input type=\"hidden\" id=\"signatureInput\" name=\"firma\" class=\"jet-form-builder__field text-field\">\r\n\r\n \r\n <div>\r\n <h3>Vista previa de la firma:<\/h3>\r\n <img id=\"signaturePreview\" alt=\"Previsualizaci\u00f3n de la firma\">\r\n <\/div>\r\n\r\n <script>\r\n \/\/ Obtener elementos del DOM\r\n const canvas = document.getElementById('signatureCanvas');\r\n const ctx = canvas.getContext('2d');\r\n const clearButton = document.getElementById('clearButton');\r\n const saveButton = document.getElementById('saveButton');\r\n const signatureInput = document.getElementById('signatureInput');\r\n const signaturePreview = document.getElementById('signaturePreview');\r\n\r\n \/\/ Variables para controlar el dibujo\r\n let isDrawing = false;\r\n\r\n \/\/ Funci\u00f3n para iniciar el dibujo\r\n canvas.addEventListener('mousedown', (event) => {\r\n isDrawing = true;\r\n ctx.beginPath();\r\n ctx.moveTo(event.offsetX, event.offsetY);\r\n });\r\n\r\n \/\/ Funci\u00f3n para continuar dibujando\r\n canvas.addEventListener('mousemove', (event) => {\r\n if (isDrawing) {\r\n ctx.lineTo(event.offsetX, event.offsetY);\r\n ctx.stroke();\r\n }\r\n });\r\n\r\n \/\/ Finalizar dibujo\r\n canvas.addEventListener('mouseup', () => {\r\n isDrawing = false;\r\n ctx.closePath();\r\n });\r\n\r\n \/\/ Detener dibujo si el cursor sale del canvas\r\n canvas.addEventListener('mouseout', () => {\r\n isDrawing = false;\r\n });\r\n\r\n \/\/ Limpiar el canvas\r\n clearButton.addEventListener('click', () => {\r\n ctx.clearRect(0, 0, canvas.width, canvas.height);\r\n });\r\n\r\n \/\/ Guardar la firma como imagen y cargarla en el input oculto y la vista previa\r\n saveButton.addEventListener('click', () => {\r\n const signatureDataURL = canvas.toDataURL('image\/png'); \/\/ Convertir canvas a base64\r\n signatureInput.value = signatureDataURL; \/\/ Guardar en el input oculto\r\n signaturePreview.src = signatureDataURL; \/\/ Mostrar la imagen en la vista previa\r\n alert('Firma guardada correctamente.');\r\n });\r\n <\/script>\r\n<\/body>\r\n<\/html>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>Firma Digital en JetFormBuilder Limpiar Guardar Firma Vista previa de la firma:<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-15274","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/globalproficio.com\/es\/wp-json\/wp\/v2\/pages\/15274","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/globalproficio.com\/es\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/globalproficio.com\/es\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/globalproficio.com\/es\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/globalproficio.com\/es\/wp-json\/wp\/v2\/comments?post=15274"}],"version-history":[{"count":9,"href":"https:\/\/globalproficio.com\/es\/wp-json\/wp\/v2\/pages\/15274\/revisions"}],"predecessor-version":[{"id":15283,"href":"https:\/\/globalproficio.com\/es\/wp-json\/wp\/v2\/pages\/15274\/revisions\/15283"}],"wp:attachment":[{"href":"https:\/\/globalproficio.com\/es\/wp-json\/wp\/v2\/media?parent=15274"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t

\n\t\t\t\t\t

\n\t\t\t\t

\n\t\t\t\t\t\r\n\r\n\r\n \r\n \r\n Firma Digital en JetFormBuilder<\/title>\r\n <style>\r\n .signature-container {\r\n border: 1px solid #ccc;\r\n margin: 20px auto;\r\n padding: 10px;\r\n width: 100%;\r\n max-width: 400px;\r\n }\r\n canvas {\r\n border: 1px solid #000;\r\n cursor: crosshair;\r\n width: 100%;\r\n }\r\n button {\r\n margin: 5px;\r\n padding: 10px 20px;\r\n font-size: 16px;\r\n cursor: pointer;\r\n }\r\n img {\r\n max-width: 100%;\r\n height: auto;\r\n border: 1px solid #ccc;\r\n margin-top: 10px;\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n \r\n <div class=\"signature-container\">\r\n <canvas id=\"signatureCanvas\" width=\"400\" height=\"200\"><\/canvas>\r\n <br>\r\n <button id=\"clearButton\">Limpiar<\/button>\r\n <button id=\"saveButton\">Guardar Firma<\/button>\r\n <\/div>\r\n\r\n \r\n <input type=\"hidden\" id=\"signatureInput\" name=\"firma\" class=\"jet-form-builder__field text-field\">\r\n\r\n \r\n <div>\r\n <h3>Vista previa de la firma:<\/h3>\r\n <img id=\"signaturePreview\" alt=\"Previsualizaci\u00f3n de la firma\">\r\n <\/div>\r\n\r\n <script>\r\n \/\/ Obtener elementos del DOM\r\n const canvas = document.getElementById('signatureCanvas');\r\n const ctx = canvas.getContext('2d');\r\n const clearButton = document.getElementById('clearButton');\r\n const saveButton = document.getElementById('saveButton');\r\n const signatureInput = document.getElementById('signatureInput');\r\n const signaturePreview = document.getElementById('signaturePreview');\r\n\r\n \/\/ Variables para controlar el dibujo\r\n let isDrawing = false;\r\n\r\n \/\/ Funci\u00f3n para iniciar el dibujo\r\n canvas.addEventListener('mousedown', (event) => {\r\n isDrawing = true;\r\n ctx.beginPath();\r\n ctx.moveTo(event.offsetX, event.offsetY);\r\n });\r\n\r\n \/\/ Funci\u00f3n para continuar dibujando\r\n canvas.addEventListener('mousemove', (event) => {\r\n if (isDrawing) {\r\n ctx.lineTo(event.offsetX, event.offsetY);\r\n ctx.stroke();\r\n }\r\n });\r\n\r\n \/\/ Finalizar dibujo\r\n canvas.addEventListener('mouseup', () => {\r\n isDrawing = false;\r\n ctx.closePath();\r\n });\r\n\r\n \/\/ Detener dibujo si el cursor sale del canvas\r\n canvas.addEventListener('mouseout', () => {\r\n isDrawing = false;\r\n });\r\n\r\n \/\/ Limpiar el canvas\r\n clearButton.addEventListener('click', () => {\r\n ctx.clearRect(0, 0, canvas.width, canvas.height);\r\n });\r\n\r\n \/\/ Guardar la firma como imagen y cargarla en el input oculto y la vista previa\r\n saveButton.addEventListener('click', () => {\r\n const signatureDataURL = canvas.toDataURL('image\/png'); \/\/ Convertir canvas a base64\r\n signatureInput.value = signatureDataURL; \/\/ Guardar en el input oculto\r\n signaturePreview.src = signatureDataURL; \/\/ Mostrar la imagen en la vista previa\r\n alert('Firma guardada correctamente.');\r\n });\r\n <\/script>\r\n<\/body>\r\n<\/html>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>Firma Digital en JetFormBuilder Limpiar Guardar Firma Vista previa de la firma:<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-15274","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/globalproficio.com\/es\/wp-json\/wp\/v2\/pages\/15274","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/globalproficio.com\/es\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/globalproficio.com\/es\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/globalproficio.com\/es\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/globalproficio.com\/es\/wp-json\/wp\/v2\/comments?post=15274"}],"version-history":[{"count":9,"href":"https:\/\/globalproficio.com\/es\/wp-json\/wp\/v2\/pages\/15274\/revisions"}],"predecessor-version":[{"id":15283,"href":"https:\/\/globalproficio.com\/es\/wp-json\/wp\/v2\/pages\/15274\/revisions\/15283"}],"wp:attachment":[{"href":"https:\/\/globalproficio.com\/es\/wp-json\/wp\/v2\/media?parent=15274"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}