Skip to content
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

Horizontal form and has-error on a single field #14735

Closed
odan opened this issue Oct 6, 2014 · 4 comments
Closed

Horizontal form and has-error on a single field #14735

odan opened this issue Oct 6, 2014 · 4 comments
Labels

Comments

@odan
Copy link

odan commented Oct 6, 2014

I have two input fields in a form-horizontal > form-group.
The first field is required and the second field is optional.
If the first field is empty I only want to show an 'has-error' for the first input field
and not for the whole form-group.

Here is an example:
http://jsfiddle.net/6968cyqr/

How can i set an 'has-error' for a single input field?

@Saranya-Raaj
Copy link

Please enclose each input fields by form-group. Please go thru the bootstrap doc.

updated fiddle

@odan
Copy link
Author

odan commented Oct 6, 2014

It doesn't work for me because I lost the horizontal space between the two input fields.

bs_form

It works for me if I append 'has-error' to the col div.
But I'm not sure if it's valid "bootstrap markup"?
http://jsfiddle.net/qh3L376r/

<div class="col-md-3 has-error">
    <input type="text" name="firstname" class="form-control">
</div>

bs_form2

@hnrch02 hnrch02 added the css label Oct 6, 2014
@praveenpuglia
Copy link
Contributor

It works because you removed the form-group classes from the divs containing the input fields. BTW dont you think you need form-inline instead of form-horizontal in this case since you want the inputs side by side?

Something like this?
http://jsfiddle.net/j84yvwyn/

@mdo
Copy link
Member

mdo commented Oct 26, 2014

We don't currently support it on multiple fields. Changing that would break backward compatibility, so we can't do it until v4.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

5 participants