So, bootstrap v4 alpha has changed form validation classes a bit. Now, to apply validation styles to a form input, you apply the CSS class to the parent div.form-group
.
I'm writing a website using ASP.NET MVC4, and am trying to figure out how to apply this CSS class to a parent HTML element.
For example, here's my current HTML for a form input element ...
<div class="form-group">
@Html.LabelFor(m => m.Password)
@Html.PasswordFor(m => m.Password, new { @class = "form-control" })
@Html.ValidationMessageFor(m => m.Password)
</div>
If my view's model has a validation error for the Password
field, it'll get a corresponding bit of text below the input field. That's what that ValidationMessageFor
call does.
But, with bootstrap v4, I need to apply a has-danger
class to the parent div.form-group
. It'd need to look like so ...
<div class="form-group has-danger">
@Html.LabelFor(m => m.Password)
@Html.PasswordFor(m => m.Password, new { @class = "form-control" })
@Html.ValidationMessageFor(m => m.Password)
</div>
But, I only want to apply that if there is a validation message for the password field.
Any idea how to achieve this with Razor?