We can listen to changes inside existing and new repeat item views with the following JavaScript code examples.
Using jQuery to listen to all input field changes in new and existing repeat group items.
// Listen to a specific repeat group and all its input field changes based on the repeat component Id
$('#component-7b6a-bd17-1576').on('change', '.input_content', function(event) {
// Get field value
var field_value = $(this).val();
// Get field/component id
var field_id = $(event.currentTarget).closest(".form-group").attr("id").replace("component-", "");
// Get field value
var field_label = window.formyoula.form_fields[field_id].get('label');
});
Please update the "#component-7b6a-bd17-1576" with your Repeat Group Id.
Listening to field changes in new repeat group views.
// Listen to field changes
formyoula.form_fields['Text Field'].on('all', function (options) {
// Get field value
var field_label = this.get('label');
// Get field value
var field_value = this.get('value');
// Get field Id
var field_id = this.get('component_id');
});
// Listen to field changes
formyoula.form_fields['Number Field'].on('all', function (options) {
// Get field value
var field_label = this.get('label');
// Get field value
var field_value = this.get('value');
// Get field Id
var field_id = this.get('component_id');
});
// Listen to field changes
formyoula.form_fields['Email Field'].on('all', function (options) {
// Get field value
var field_label = this.get('label');
// Get field value
var field_value = this.get('value');
// Get field Id
var field_id = this.get('component_id');
});
Listening to field changes in existing repeat group views.
// Listen to existing repeat group item changes
formyoula.form_fields['Repeat Group'].on('repeat:item:change', function (options) {
// Check if field updates are available
if ( _.isEmpty( options.updated_sub_component ) ) return;
// Get field value
var field_label = options.updated_sub_component.get('label');
// Get field value
var field_value = options.updated_sub_component.get('value');
// Get field Id
var field_id = options.updated_sub_component.get('component_id');
});
For any questions, please contact us - [email protected] or the Formyoula in-app chat 🙂