<ab-create-ticket id="my-ticket-form" ticketFormID="YOUR-TICKET-FORM-ID">
  <button>Create ticket</button>
</ab-create-ticket>
 
<script>
  const ticketform = document.getElementById('my-ticket-form');
 
  /**
   * We can add our own middleware to the ticket form.
   * ❌ No need for SDKs or heavy iframes!
   * ✅ The custom HTML element has all the functions you need.
   */
  ticketform.onCreateTicket = (values) => {
    return values.map((fieldValue) => {
      if (fieldValue.id === 'uc8xt') {
        return {
          ...fieldValue,
          // We're handling field values dynamically...
          value: user.isOnTrial ? 'Yes' : 'No',
        };
      }
 
      return fieldValue;
    });
  };
</script>

<ab-create-ticket id="my-ticket-form" ticketFormID="YOUR-TICKET-FORM-ID">
  <button>Create ticket</button>
</ab-create-ticket>
 
<script>
  const ticketform = document.getElementById('my-ticket-form');
 
  /**
   * We can add our own middleware to the ticket form.
   * ❌ No need for SDKs or heavy iframes!
   * ✅ The custom HTML element has all the functions you need.
   */
  ticketform.onCreateTicket = (values) => {
    return values.map((fieldValue) => {
      if (fieldValue.id === 'uc8xt') {
        return {
          ...fieldValue,
          // We're handling field values dynamically...
          value: user.isOnTrial ? 'Yes' : 'No',
        };
      }
 
      return fieldValue;
    });
  };
</script>