This guide will explain how to add a loading state to the repeat group “Add” item button. This will help with a UI indication to users that the repeat group item is being added if custom logic is delaying the item from being added instantly.
Add the following JavaScript to your form in a JavaScript field.
For any questions, please get in touch with us - [email protected] or the Formyoula in-app chat 🙂
// Bind the click event to elements with class .add inside a repeat
$( '.formyoula-Repeat' ).on( 'click', '.add', function( event ) {
// Get a reference to the button
var repeat_add_button = $( this );
// Activate loading state
repeat_add_button.button( 'loading' );
// Reset to normal state after 3 seconds
setTimeout( function() {
// Reset button original label text
repeat_add_button.button( 'reset' );
}, 3000 );
} );