Trigger API Prefill On Repeat Create And Delete Events

In this guide, we will share two JavaScript options for triggering the API fields.

Manual data mapping from Repeat Group entry changes.

// Set repeat group Id
var repeat_group_id = '5988-591b-61a6';
// Set API Callout fields
var api_add_field_id = '5988-591b-61a6';
var api_delete_field_id = '5988-591b-61a6';
// Listen to Repeat Entry Create Event on the repeat component
window.formyoula.form_fields[ repeat_group_id ].on( 'element:create:success', function( fields /* Created Repeat Entry Data */ ) {
  // Trriger API Prefill Passing the data to Event
  window.formyoula.form_fields[ api_add_field_id ].trigger( 'api:request:send', {
    data: {
      param1: fields[ 0 ].value,
      param2: fields[ 1 ].value
    }
  } );
} );
// Listen to Repeat Entry Delete Event on the repeat component
window.formyoula.form_fields[ repeat_group_id ].on( 'element:delete:success', function( fields /* Deleted Repeat Entry Data */ ) {
  // Trriger API Prefill Passing the data to Event
  window.formyoula.form_fields[ api_delete_field_id ].trigger( 'api:request:send', {
    data: {
      param1: fields[ 0 ].value,
      param2: fields[ 1 ].value
    }
  } );
} );

Dynamic data mapping from Repeat Group entry changes.

// Set repeat group Id
var repeat_group_id = '5988-591b-61a6';
// Set API Callout fields
var api_add_field_id = '5988-591b-61a6';
var api_delete_field_id = '5988-591b-61a6';
// Listen to Repeat Entry Create Event on the repeat component
window.formyoula.form_fields[ repeat_group_id ].on( 'element:create:success', function( fields /* Created Repeat Entry Data */ ) {
  // Create data to pass to the  api trigger event
  var data = create_key_value_pair( fields );
  // Trriger API Prefill
  window.formyoula.form_fields[ api_add_field_id ].trigger( 'api:request:send', data );
} );
// Listen to Repeat Entry Delete Event on the repeat component
window.formyoula.form_fields[ repeat_group_id ].on( 'element:delete:success', function( fields /* Deleted Repeat Entry Data */ ) {
  // Create data to pass to the api trigger event
  var data = create_key_value_pair( fields );
  // Trriger API Prefill
  window.formyoula.form_fields[ api_delete_field_id ].trigger( 'api:request:send', data );
} );

// Function to create key value pair
function create_key_value_pair( fields ) {
  // Create object to store key value pair
  var reuturn_val = {};
  // Loop through the fields to add key value pair
  fields.forEach( function( field ) {
    // Add key value pair
    reuturn_val[ field.name ] = field.value;
  } );
  // Restructure and return data
  return { data: reuturn_val };
}

For any questions, please get in touch with us - at [email protected] or the Formyoula in-app chat 🙂