How to show bootstrap alerts based on your modelstate in MVC 5

For those of you who are using Bootstrap. Bootstrap has very cool alert classes that allow you to display validation messages.

They look like this:

And they can be used like this.

Success:

<!-- Success Alert -->
    <div class="alert alert-success alert-dismissible fade show">
        <strong>Success!</strong> Your message has been sent successfully.
        <button type="button" class="close" data-dismiss="alert">&times;</button>
    </div>

Error:

<!-- Error Alert -->
    <div class="alert alert-danger alert-dismissible fade show">
        <strong>Error!</strong> A problem has been occurred while submitting your data.
        <button type="button" class="close" data-dismiss="alert">&times;</button>
    </div>

Warning:

<!-- Warning Alert -->
    <div class="alert alert-warning alert-dismissible fade show">
        <strong>Warning!</strong> There was a problem with your network connection.
        <button type="button" class="close" data-dismiss="alert">&times;</button>
    </div>

Info:

<!-- Info Alert -->
    <div class="alert alert-info alert-dismissible fade show">
        <strong>Info!</strong> Please read…