Create Repeat Entries From Multi Select List Value

In this guide, we will explain how to Create Repeat Entries from Multi Select List value.

  1. Drag and Drop a MultiSelect List, a JavaScript and a Repeat group element. Drag and Drop a Text field and a Number field inside the repeat group.

Add some product name in MultiSelect List and rename the Text and the number field.

image
  1. Click the pencil icon and paste the code inside the JavaScript element.
image
  1. Use the below code:
// Component id of the field that need to be prefilled based on value
var component_id_field = 'ac27-66f5-153a';
// Id of repeat group
var Repeat_group_id = '65e3-c4cf-f106';
// Listen to multi-select field input event
formyoula.form_fields[ '0c3a-520d-546f' ].on( 'input:set:success', function( e ) {
  //Get array i.e. value of multiselect field
  var multi_select_value = formyoula.form_fields[ '0c3a-520d-546f' ].get( 'value' );
  // multiselect_to_repeat_values function
  multiselect_to_repeat_values( multi_select_value, Repeat_group_id, component_id_field );
} );
// Function to create repeat entries from multiselect values
function multiselect_to_repeat_values( multi_select_value, Repeat_group_id, component_id_field ) {
  // If no option is selected
  if ( !multi_select_value ) {
    // Remove all entries
    formyoula.form_fields[ Repeat_group_id ].set( 'repeat_value', [] );
  }
  // else
  else {
    //Create an array to store value of each entry
    var records = [];
    //Loop through multiselect field value
    multi_select_value.forEach( function( dataItem ) {
      //Create single repeat components
      var record = [];
      // Get components of repeat group and loop
      formyoula.form_fields[ Repeat_group_id ].get( 'components' ).forEach( function( item ) {
        // Convert into json
        item = item.toJSON();
        // Check for component id and set the value of component
        if ( item.component_id == component_id_field ) {
          item.value = dataItem.split( ',' )[ 0 ];
        }
        //Push
        record.push( item );
      } );
      //Push data
      records.push( record );
    } );
    //Set value on repeat group
    formyoula.form_fields[ Repeat_group_id ].set( 'repeat_value', records );
  }
}
  1. Please Change the field Ids according to your form.
image
  1. Save the changes and try the form.
image

If you have any questions, please use the in-app chat or email us - [email protected]