MVC Bootstrap Update breaks CSS

Hi.

I recently updated all of the NuGet packages in one of my solutions, and it seemed to break the CSS.

I recreated the project and copied the model, controller and views across to the new project. I then updated the NuGet packages one by one, and when I updated to Bootstrap 4.0.0 (or later) it broke!

When I downgraded to 3.3.7 it all came back again 🙂

Therefore, it is probably outdated code in the MVC template in Visual Studio that causes the new bootstrap to break it.

Hopefully this will help other people having the same issue

C#: Class to get the connection string for Entity Framework

using System;
using System.Data.SqlClient;
using System.Data.EntityClient;

using System.Globalization;
using System.Configuration;

namespace ProjectFrameworkLayer
{
    public class ProjectFrameworkLayerBase
    {
        internal string GetEntityConnectionString()
        {
            // Initialize the connection string builder for the underlying provider.
            SqlConnectionStringBuilder sqlBuilder =
                new SqlConnectionStringBuilder();

            string dataSource = ConfigurationManager.AppSettings["Entity_DataSource"].ToString(CultureInfo.InvariantCulture);
            string initialCatalog = ConfigurationManager.AppSettings["Entity_InitialCatalogue"].ToString(CultureInfo.InvariantCulture);
            bool integratedSecurity = Convert.ToBoolean(ConfigurationManager.AppSettings["Entity_IntegratedSecurity"]);

            // Set the properties for the data source.
            sqlBuilder.DataSource = dataSource;
            sqlBuilder.InitialCatalog = initialCatalog;
            sqlBuilder.IntegratedSecurity = integratedSecurity;

            if (!sqlBuilder.IntegratedSecurity)
            {
                sqlBuilder.UserID = ConfigurationManager.AppSettings["Entity_UserName"].ToString(CultureInfo.InvariantCulture);
                sqlBuilder.Password = ConfigurationManager.AppSettings["Entity_Password"].ToString(CultureInfo.InvariantCulture);
            }

            sqlBuilder.MultipleActiveResultSets = Convert.ToBoolean(ConfigurationManager.AppSettings["Entity_MultipleActiveResultSets"]);
            sqlBuilder.ApplicationName = ConfigurationManager.AppSettings["Entity_ApplicationName"].ToString(CultureInfo.InvariantCulture);

            // Initialize the EntityConnectionStringBuilder.
            EntityConnectionStringBuilder entityBuilder =
                new EntityConnectionStringBuilder();

            entityBuilder.Metadata = ConfigurationManager.AppSettings["Entity_MetaData"].ToString(CultureInfo.InvariantCulture);
            entityBuilder.ProviderConnectionString = sqlBuilder.ToString();
            entityBuilder.Provider = ConfigurationManager.AppSettings["Entity_ProviderName"].ToString(CultureInfo.InvariantCulture);

            return entityBuilder.ToString();
        }
    }
}

JavaScript: Show/Hide field

$(document).ready(function () {
    if ($("#ID").val() == "1") {
        $("#Other").show();
    }
    else {
        $("#Other").hide();
    }
});
function ShowHideOther() {
    if ($("#ID").val() == "1") {
        $("#Other").show();
    }
    else {
        $("#Other").val("");
        $("#Other").hide();
    }
}

Add

new { onchange = "ShowHideOther()" }

to the drop-down list definition in the view

MVC: Drop-down List

Populate the list of drop-down options (using “ID” and “Description”) from within the Controller:

ViewBag.DropDownOptions = new SelectList(
        obj.GetDropDownOptions(), 
        "ID", 
        "Description", 
        string.Empty);

Then create a Drop-Down List within the View. Model.ID should refer to the source value, and then the list of options:

@Html.DropDownListFor(
    model => model.ID, 
    (IEnumerable)ViewData["DropDownOptions"])