paulus macaulus asked 2 years ago
Hi,
I have a Repeater in a form that I need to have hidden initially and then show when the conditions have been met to do so.
This is working as it should however, within the repeater, I have a radio button with two options, "Single Share" or "Twin Share" to select the room type. Text fields for First Name and Last Name are required. These text fields are hidden initially until a selection on the radio button is made, Single shows 2x text fields for First and Last Name, and Twin shows 4x text fields 2 for First Name, 2 for Last Name.
The behaviour has been created in javascript as it is more complex than formidable's conditions can handle. No conditional formatting has been applied to any of the fields within the repeater, only the repeater itself (acting as a Section).
The formidable Conditional to show the repeater "Section" if other things have happened in the form is working but it is also showing the text fields that should not show and have been hidden by custom javascript.
Does anyone know how to have these text boxes not be shown when the repeater wrapper gets triggered and only when the javascript shows and hides the fields based on the users choice.
Any help is appreciated.
Paul
paulus macaulus answered 2 years ago
Hi,
Thanks for your reply Rob, as is usually the case for me, time restraints forced by the client wanting something working have made me adjust my approach. Using pagination instead of conditional logic in the form has worked to deliver the desired functionality needed this time.
Victor Font Staff answered 2 years ago
jQuery isn't working because it has to to with the HTML Document Object Model (DOM), jQuery binding, and hidden elements. jQuery cannot bind to hidden elements. When your section is hidden, so are the fields you want to manipulate with jQuery. They are effectively removed from the DOM until they are shown. You either have to reinitialize the jQuery when the fields are shown like we do with adding repeater rows or use a different approach altogether. This article about repeaters and how the DOM works with jQuery may give you insights on how to fix your issue. There is reinit code in this tutorial that you can leverage. https://formidable-masterminds.com/repeaters-and-complex-jquery-operations/
paulus macaulus answered 2 years ago
Hi Victor,
Im sure Chet (ChatGPT4) will be able to work it out and i’ll get him to take a look. Everything was working until the repeater was conditionally hidden, the functionally was still working mostly , it’s just that the fields were shown along with the rest of the fields in the repeater as opposed to those text fields to enter a name all being hidden and only revealing after someone had selected single or twin share, allowing one first & last name or two to be entered. Paginating the form allowed the text fields to remain hidden. Client has seen it and likes it better as i put in a summary field, hopefully people will check before committing to sometimes thousands of dollars to book only 25%of the overall.
Please login or Register to submit your answer
I've had no luck combining Formidable's conditional logic with jQuery for the same field. I've found that if you have jQuery conditional logic on a field it will likely lose out to the Formidable logic, though that might depend on whether you use Before Fields or After Fields. The only solution I've found is to do all the conditional logic in jQuery, though that's easier said than done because it could have unintended consequences.