Disable Fields On Newly Added Repeat Group Entries

In this guide, we will share an example on how to disable all fields on a newly added repeat group entry.

// Listen to all form field initialize events
window.formyoula.form_entry.on( 'form:field:initialize', function( options ) {
  // Update field
  update_field_attributes( options.view.model );
} );
// Function to update specific field attributes
function update_field_attributes( field ) {
  // Check if field is inside repeat group
  if ( field.get( 'attributes' ).repeat_entry_id ) {
    // Add the new field attributes we want to change
    var custom_html_attributes = [ 
      {
        attribute: 'disabled',
        type: 'input',
        value: 'disabled'
      }
    ];
    // Update the field with new attributes
    field.get( 'attributes' ).options = custom_html_attributes;
    // Update target field to read-only
    field.get( 'attributes' ).readonly = 'yes';
  }
} // END update_field_attributes

We can also specify a list of fields we would like to disable instead of disabling all fields.

// Repeat Group fields to disable after repeat entry is added
var repeat_fields_to_disable = 'a812-9456-3264,9da3-bdd8-dd35';
// Listen to all form field initialize events
window.formyoula.form_entry.on( 'form:field:initialize', function( options ) {
  // Update field
  disable_repeat_entry_field( options.view.model );
} );
// Function to update specific field attributes
function disable_repeat_entry_field( field ) {
  // Check if field is inside repeat group and is a field we want to disable
  if ( field.get( 'attributes' ).repeat_entry_id && repeat_fields_to_disable.includes( field.get( 'component_id' ) ) ) {
    // Update the field with new attributes
    field.get( 'attributes' ).options = [ {
      type: 'input',
      attribute: 'disabled',
      value: 'true'
    } ];
  }
} // END disable_repeat_entry_field

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

// Listen to all form field initialize events window.formyoula.form_entry.on( 'form:field:initialize', function( options ) { // Update field update_field_attributes( options.view.model ); } ); // Function to update specific field attributes function update_field_attributes( field ) { // Check if field is inside repeat group if ( field.get( 'attributes' ).repeat_entry_id ) { // Add the new field attributes we want to change var custom_html_attributes = [ { attribute: 'disabled', type: 'input', value: 'disabled' } ]; // Update the field with new attributes field.get( 'attributes' ).options = custom_html_attributes; // Update target field to read-only field.get( 'attributes' ).readonly = 'yes'; } } // END update_field_attributes

// Repeat Group fields to disable after repeat entry is added var repeat_fields_to_disable = 'a812-9456-3264,9da3-bdd8-dd35'; // Listen to all form field initialize events window.formyoula.form_entry.on( 'form:field:initialize', function( options ) { // Update field disable_repeat_entry_field( options.view.model ); } ); // Function to update specific field attributes function disable_repeat_entry_field( field ) { // Check if field is inside repeat group and is a field we want to disable if ( field.get( 'attributes' ).repeat_entry_id && repeat_fields_to_disable.includes( field.get( 'component_id' ) ) ) { // Update the field with new attributes field.get( 'attributes' ).options = [ { type: 'input', attribute: 'disabled', value: 'true' } ]; } } // END disable_repeat_entry_field