Menu icon Foundation
Form, Data-Abide Issue

Using a form with data-abide. when there is a field error, rather than an error message being attached to the field or the label displaying red, all the input boxes are losing their layout and bunching up together. If you correct the input entry, the layout corrects itself? Looking on Firebug, the inputs have an error class assigned to them.

formdata-abide

Using a form with data-abide. when there is a field error, rather than an error message being attached to the field or the label displaying red, all the input boxes are losing their layout and bunching up together. If you correct the input entry, the layout corrects itself? Looking on Firebug, the inputs have an error class assigned to them.

K Lim over 5 years ago

I noticed that if you use a form declared with data-abide, each of your inputs in the form has to be followed by a HTML element that has the class error. If you don't, you will see the bunching effect you described.

See the e.g. here
http://foundation.zurb.com/docs/components/abide.html

David Jackson over 5 years ago

Thanks. Didn't realise that was mandatory. I'll give it a try