Signature inside a div don't work

1

How can i manually insert the Signature control inside a Container ?

When I tried it, it doesn’t work.

<div style="padding:10px; font-weight:bold; background-color:#7ea902; color:white;" id="sign">
 <div>Checked and approved by</div>
 <small>Name</small><small style="position: absolute; left:250px;">Signed</small>
 <div><input></input><canvas id="Signature1" name="Signature1_img" style="border-width:2px; border-style:dotted; border-color:gray; " class="" width="450" height="225"></canvas></div>
</div>
2

When you say it doesn’t work, what happens?

I added a Container and a Signature to a project. I then dragged the Signature into the Container on the Design Screen. It seems to work. Here’s how it looks:

Screen Shot 2021-10-11 at 7.33.50 AM
Screen Shot 2021-10-11 at 7.33.50 AM805×652 75.1 KB

Screen Shot 2021-10-11 at 7.34.03 AM

3

Hi,

I didn’t use the drag and drop of the controls.

I have a container which I have manually typed in my own html code inside that container. I,e I replaced the default “Content” text with my own html code for tables etc. Within that code id like to add a signature pad.

4

I have kind of got it working now using code from here Signature field in HTML form ✦ DA-Software.net.

It seems I needed to activate it with

var wrapper = document.getElementById("signature-pad"),
    canvas = wrapper.querySelector("canvas"),
    signaturePad;

var signaturePad = new SignaturePad(canvas);