Formidable Forms repeater fields are a great product feature. While the repeaters work fine with standard math calculations available through Formidable's shortcodes, more complex operations, such as we're addressing in this tutorial, require custom jQuery code. Getting the code to work correctly can be somewhat elusive though. This tutorial demonstrates how to get Formidable's repeater field to work with jQuery calculations as new rows are added to the form.
In this tutorial, you'll learn:
- How repeaters work from both the Formidable and Document Object Model (DOM) perspectives
- How to overcome repeater challenges in the DOM
- Writing code that works
- There's also an example repeater form for you to play with that does not save entries to the database.
2 comments on “Formidable Forms Repeaters and Complex jQuery Operations”
Thank you for this Victor!
I ended up using it as a base to check if more than 3 weekdays had been selected in a checkbox field, within a repeater, and then populate both a separate field in the repeater and one outside with a set value. I also added a second callback for another repeater to do similar, but also display a hidden html field outside the repeater.
I'm not sure if it was the right approach, but I added an 'else if' to include the second section in the active element part.:
if (active_elem == '10832') {
repeater_row_init( repeater_section );
} else if (active_elem == '10846') {
repeater_row_init( repeater_section );
}
Was that right, or is there a better way?
Thanks again!
"I'm not sure if it was the right approach"
Lisa, if it works it's a right approach. Congratulations on figuring this out. I'm sure others will find your solution useful.