Question

Refresh Section on clicking "Accept" or "Clear" in Signature Capture field

Greetings:

I have a section that contains a "signature capture" field and a date property called "RequesterSignatureDate". When a user signs the signature capture field and clicks "Accept", I would like to update the "RequesterSignatureDate" with the current date, and refresh the section. If the user clicks "Clear", I want to clear "RequesterSignatureDate", and refresh the section.

I have attempted to set a "Refresh Condition" on the section and run a data transformation when the Signature field changes, but I have been unsuccessful. There is no way to add an Action Set to a "signature capture" field, either.

Any suggestions are appreciated.

Correct Answer
September 20, 2019 - 4:56pm

Hi,

If the RequesterSignatureDate is just for the display purpose, I have an idea to accomplish this without relying on activity/data transform or a refresh section.

1.Add a hidden non auto generated section just below the signature control

2. Add the below code in that section

---------------------

<script>
  function setDate(){
    var today = new Date();
    var date = today.getFullYear()+'-'+(today.getMonth()+1)+'-'+today.getDate();
    var time = today.getHours() + ":" + today.getMinutes() + ":" + today.getSeconds();
    var dateTime = date+' '+time;
    $("[name='$PpyWorkPage$pFirstName']").val(dateTime); /* this name should be changed based on where you want to display the date*/
  }
  function clearDate(){
    $("[name='$PpyWorkPage$pFirstName']").val(""); /* this name should be changed based on where you want to display the date*/
  }
  $(".signature-accept-action").on("click",setDate);
  $(".signature-clear-action").on("click",clearDate);
</script>

---------------------

This code is to add click events on accept and clear buttons to set and clear current date time. As commented in the code, you need to replace the name of text input with your's.

You can change the format of the date time based on your requirements.

I am attaching gif that shows the working behavior. I am not sure if there is a better way to achieve this.

Comments

Keep up to date on this post and subscribe to comments

Pega
September 20, 2019 - 4:56pm

Hi,

If the RequesterSignatureDate is just for the display purpose, I have an idea to accomplish this without relying on activity/data transform or a refresh section.

1.Add a hidden non auto generated section just below the signature control

2. Add the below code in that section

---------------------

<script>
  function setDate(){
    var today = new Date();
    var date = today.getFullYear()+'-'+(today.getMonth()+1)+'-'+today.getDate();
    var time = today.getHours() + ":" + today.getMinutes() + ":" + today.getSeconds();
    var dateTime = date+' '+time;
    $("[name='$PpyWorkPage$pFirstName']").val(dateTime); /* this name should be changed based on where you want to display the date*/
  }
  function clearDate(){
    $("[name='$PpyWorkPage$pFirstName']").val(""); /* this name should be changed based on where you want to display the date*/
  }
  $(".signature-accept-action").on("click",setDate);
  $(".signature-clear-action").on("click",clearDate);
</script>

---------------------

This code is to add click events on accept and clear buttons to set and clear current date time. As commented in the code, you need to replace the name of text input with your's.

You can change the format of the date time based on your requirements.

I am attaching gif that shows the working behavior. I am not sure if there is a better way to achieve this.

September 21, 2019 - 10:48pm

This was a great suggestion. It appears to meet the requirements quite well. Thanks so much!

Pega
September 22, 2019 - 9:34am
Response to Alan.R.Thompson

You are welcome :)