New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Form Builder - required field are validated after being hidden #301

Closed
Tomasz-Zlamaniec opened this Issue Sep 6, 2016 · 1 comment

Comments

Projects
None yet
2 participants
@Tomasz-Zlamaniec
Copy link

Tomasz-Zlamaniec commented Sep 6, 2016

Hexagon version: 1.6.0

Expected

From form builder documentation for FormBuilder.hidden

A method setting the hidden state for a form property. Hidden properties will be visually hidden and their values will not be present in the form data.

I'd expect that if the property will be hidden and not included in the form data then it will not be validated. There is no simple way of removing 'required' attribute when hiding a field and setting default value would complicate the code.

Actual

When submitting a form with empty but required hidden field, the form is showing validation error for the field above the hidden field. Super confusing if a text field has error message "Please select a value from the list" because picker field below is hidden.

As expected, if the field is hidden after a value has been selected, then the form can be submitted and only the visible field is included in the form's data so that part works fine, only the validation is causing a problem.

Example

var form = new hx.Form('#form');
form.addText("Field 1");
form.addPicker("Field 2", ["Type A", "Type B"], {required: true});
form.addSubmit("Submit");
form.hidden("Field 2", true);

image

@c-frater

This comment has been minimized.

Copy link
Contributor

c-frater commented Sep 30, 2016

I think the best way to deal with this would be to update the validateForm function so that it doesn't detect elements that are not visible. This would then deal with situations where the validation is used on static html forms:
https://github.com/ocadotechnology/hexagonjs/blob/master/modules/form/main/index.coffee#L22

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment