MVC - Add New Fields to your MVC Project in under 10 minutes

Add Column to Database Schema
So you created your MVC project by defining your Model first, then creating your views.  But now you need to add some new data fields and have that propagate throughout.  This is easy, assuming you don't care about the data in your test database anyway.

What You Will Do
You will use the Code First Migrations of the Entity Framework to migrate your changes from the model class to your database table.  This will involve:

• Deleting the database
• Using the Package Manager Console

Now Hop to It
Now follow these steps to destroy your test database, add a property, re-create the database, and update the corresponding views.

1. Delete.  Click on the View all Files icon in the Solution Explorer.  Expand your App_Data.  Delete the .mdf file.
    
2. Package Manager Console.  Go to Tools > Library Package Manager and click on Package Manager Console.
    
3. Enable Migrations.  Type Enable-Migrations -ContextTypeName and hit enter.  For Example:
     Enable-Migrations -ContextTypeName MyCompany.Models.CompanyDBContext  
4. Add Migration.  In the PM console type add-migration Initial and hit enter.
    
5. Add Property.  Add your property to the class and rebuild solution.
    
6. Update Database.  In the PM console type update-database and hit enter.  Rebuild your solution.  Refresh your solution explorer.  You should now see the .mdf under App_Data.
    
7. Update Views - Index.  Open the Index.cshtml and enter in the @Html.DisplayNameFor(Mode => model.)
   >.  The field is the new property you just added to the class.  Do the same under the for-each section too.  For example: <th>;
      @Html.DisplayNameFor(model => model.Salary2)
    </th>
   
8. Update Views - Edit.  Open the Edit.cshtml and enter in the @Html.DisplayNameFor(Mode => model. ).  The field is the new property you just added to the class.  Do the same under the for-each section too.  For example:
     <div class="editor-field">
     @Html.EditorFor(model => model.Salary2)
     @Html.ValidationMessageFor(model => model.Salary2)
   </div>  
9. Update Views - Details.  Open the Details.cshtml and enter in the @Html.DisplayNameFor(Mode => model.) The field is the new property you just added to the class.  Do the same under the for-each section too.  For example: 
   <div class="display-field">
      @Html.DisplayFor(model => model.Salary2)
   </div>

Seed Data
You can have the database pre-populated with test data by using the Seed method in the Configuration.cs file.  This is very handy when you want to version control your code AND your test data.

           context.Companies.AddOrUpdate(i => i.JobTitle,
          new Company
          {
          JobTitle = "IT Minion",
          InterviewDate1 = DateTime.Parse("2012-12-11"),
          ContactName = "Classy Recruiter",
          Salary = 80000.00M,
          SubmitDate = DateTime.Parse("2012-12-01")
          },
          new Company
          {
          JobTitle = "IT Minion Manager",
          InterviewDate1 = DateTime.Parse("2012-12-11"),
          ContactName = "Classy Recruiter",
          Salary = 115000.00M,
          SubmitDate = DateTime.Parse("2012-12-01")
          }
      );

       companies.ForEach(d => context.Company.Add(d));

In Closing
While this works fine when you don't care about the data in the database - it is obviously not possible in a production style environment.  Keep your eye out for another post that addresses how to do this in a pre-existing situation.