craft-freeform
craft-freeform copied to clipboard
Form row classes getting removed when submitting via ajax
What happened?
Am using the default Flexbox formatting template on a form. Form is set to submit using ajax and to "Reload form with a success banner above".
When the form is submitted successfully, the form loses the class="freeform-row"
attributes that were in place on each row div, which is messing up how the form looks.
Example:
Here's the markup for one of the rows prior to the form submitting...
<div class="freeform-row freeform-row">
<div class="freeform-column-6 freeform-fieldtype-text freeform-column" data-field-container="firstName" data-field-type="text"><label class="freeform-label freeform-required" for="form-input-firstName">First Name</label>
<input novalidate="" class="freeform-input" name="firstName" type="text" id="form-input-firstName" placeholder="Your first name" value="">
</div>
<div class="freeform-column-6 freeform-fieldtype-text freeform-column" data-field-container="lastName" data-field-type="text"><label class="freeform-label freeform-required" for="form-input-lastName">Last Name</label>
<input novalidate="" class="freeform-input" name="lastName" type="text" id="form-input-lastName" placeholder="Your last name" value="">
</div>
</div>
...and after the form submits, the markup for the same row in the form looks like this...
<div>
<div class="freeform-column-6 freeform-fieldtype-text freeform-column" data-field-container="firstName" data-field-type="text"><label class="freeform-label freeform-required" for="form-input-firstName">First Name</label>
<input novalidate="" class="freeform-input" name="firstName" type="text" id="form-input-firstName" placeholder="Your first name" value="">
</div>
<div class="freeform-column-6 freeform-fieldtype-text freeform-column" data-field-container="lastName" data-field-type="text"><label class="freeform-label freeform-required" for="form-input-lastName">Last Name</label>
<input novalidate="" class="freeform-input" name="lastName" type="text" id="form-input-lastName" placeholder="Your last name" value="">
</div>
</div>
I'm rendering the form just using the standard {{ form.render() }}
Errors and Stack Trace (if available)
No response
How can we reproduce this?
- Create a form that uses the 'Flexbox' formatting template
- Make sure that forms are set to use ajax for processing
- Make sure that forms are set to "Reload form with a success banner above" in the Success Behaviour settings
- Render form on a page using
{{ form.render() }}
Freeform Edition
Pro
Freeform Version
5.5.7
Craft Version
4.11.3
When did this issue start?
Fresh install of Freeform
Previous Freeform Version
No response