Prefill DateTime On The HTML Field

This guide will explain how to prefill the DateTime on the “HTML” field in a specific format.

  1. Initial Setup:
  • Drag and drop a “Salesforce Lookup”, a “Salesforce Prefill”, a “Text”, and an “HTML” field onto your form.
  • Rename the fields as needed.

Note: You can use a “Hidden” field instead of the “Text” field.

image
  1. Configuring The “Salesforce Lookup” Field:
  • Click the pencil icon of the “Salesforce Lookup” field.
  • Set “Object” and “Display Additional Fields”.
image
  1. Configuring The “Salesforce Prefill” Field:
  • Click the pencil icon of the “Salesforce Prefill” field.
  • Set “Object”, “Formyoula Parent Field”, and “Salesforce Parent Field” as shown below.
image
  • Map the form field to the Object field.
image
  1. Configuring The “HTML” Field:
image
  • Click the pencil icon of the “HTML” field.
  • Paste the code.
image
  • Please use this code.
  • Here 5d6e-5c90-d286 is the field ID of the “Text” field.
  • Save the changes.
<style>
  /* Define styles for elements with the 'wrap' class */
  .wrap {
    /* Force text to wrap within the element */
    text-wrap: wrap !important;
  }
</style>
<!-- Create a container div with a dynamic class name based on the record ID -->
<div class="container record-id-scroll-to-{{36e5-43cf-d28b}}">
  <!-- Create a row inside the container -->
  <div class="row">
    <!-- Create a column with a width of 3 units (out of 12) for the label 'Event
    Date Time:' -->
    <div class="col-xs-3">
      Event Date Time:
    </div>
    <!-- Check if the variable '5d6e-5c90-d286' is truthy (not null or undefined)
    -->
    {{#if 5d6e-5c90-d286}}
      <!-- Create a column with a width of 9 units (out of 12) and apply the 'wrap'
      class -->
      <div class="col-xs-9 wrap">
        <!-- Format and display the date stored in '5d6e-5c90-d286' using the
        'Format_Date_Function' -->
        {{Format_Date_Function 5d6e-5c90-d286 'YYYY.MM.DD hh:mm A'}}
      </div>
    {{/if}}
  </div>
</div>
  1. Test Your Form:
  • Find a record.
image
  • It will display the DateTime using the HTML field.
image

For any questions, please contact us - [email protected] or the Formyoula in-app chat. 🙂