Now we have partial views loading forms using Ajax and we can call controller methods using Ajax it's time to put everything together.

We're going to start with a blank scenario to make it easier to follow. This makes this a very long post but it puts together everything we learned.

Code files

I managed to coerce PHP into creating a new route on my website. You can see the full code for the classes/views in this demo as follows:

The jQuery Ajax built into ASP.NET MVC is very powerful but it's hard to know exactly where to start. This tutorial is a result of a few hours investigation so it's written from the point of view of a beginner.

I intend to upload code samples at some point but I need to add a code hosting feature to my website.

Setting up our test environment

We're going to use a very simple example to work with only the details we need. As always we're using a dog class, here's a picture of a dog:

So far we have seen how to add a very simple ActionLink and attach actions. Now let's load a PartialView using Ajax. Also we want to load a partial view with a different model into our page.

Getting a Partial View using ActionLink

We're going to deal with an object a Dog could "own", so we create a collar class. Let's accessorize our dog with some fabulous collars / add an ActionLink to the Dog/Details view (Details.cshtml):

@Ajax.ActionLink(linkText: "Call An Action Returning a partial view",
    actionName: "GetCollarCreate",
    routeValues: new { id = @Model.Id },
    ajaxOptions: new AjaxOptions
    {
        UpdateTargetId = "ajaxpartialtarget",
        InsertionMode = InsertionMode.Replace
    })
<div id="ajaxpartialtarget"></div>

We can pass the Id of the dog in using RouteValues as normal. The InsertionMode.Replace is default so doesn't need to be defined explicitly, I'm just doing it because it doesn't hurt to be reminded. This ActionLink calls the following method on the Dog Controller (DogController.cs):

public ActionResult GetCollarCreate(int id){
    return RedirectToAction(actionName: "_Create", 
        controllerName: "Collar", 
        routeValues: new { id });
}

This then directs us to an action on our Collar Controller class (CollarController.cs):

[HttpGet]
public PartialViewResult _Create(int id){
    Collar collar = new Collar { DogId = id };
    return PartialView(viewName: "_Create", model: collar);
}

Where our collar is a simple view model:

public class Collar
{
    public int DogId { get; set; }

    public string Color { get; set; }

    public bool HasTag { get; set; }
}

We will create a more detailed view in the next part but for now we have this simple view (Create.cshtml):

@model JunkCode.Collar
<div> Loaded the partial view for dog with Id = @Model.DogId </div>

When we build and run this we get the result we want, the view is loaded using an Ajax request, the dog woofs for joy:

Working on projects in your spare time is great because you're free to pursue every little diversion; it means you make no real progress with your actual project but you learn a lot.

When I had to add a column to one of my database tables I decided to investigate creating a DACPAC(1). A DACPAC allows you to turn your existing database into a database project in Visual Studio which means your schema can be placed under source control. Changes can then be pushed to your database in a friendly wizard format.

To create a DACPAC you right click on your existing database and choose Extract Data Tier Application under tasks:

Note: This tutorial applies to Identity 1.0 which is the previous version of ASP.NET Identity. I have a newer post on the same subject here

If you've read my previous posts you probably know I'm working on some EF Database first stuff, this seems to be the least popular way to use EF but to me seems like a common business use-case for it.

The MVC template in Visual Studio comes with the new Asp.NET Identity system built in, but it's designed to be used with Code First. This leads to people asking how to use Identity with Database First? The suggested soultion is to use the table structure provided when you use Code First and port it to your pre-existing database.

This seemed like an unpleasant approach to me (and a lot of work), especially because I think the database layout for those tables is kinda sucky. This is when it occurred to me that we're basically trying to implement Identity without using what the documentation thinks of as Entity Framework.

When you Google how to do that, you get this great post from Mark Johnson. You can follow his approach and just substitute his use of Dapper for use of Entity Framework. for instance:

public Task CreateAsync(User user)
{
    if (user == null)
    {
        throw new ArgumentNullException("user was null");
    }

    return Task.Factory.StartNew(() =>
        {
            db.Users.Add(user);
            db.SaveChanges();
        });
}

public Task DeleteAsync(User user)
{
    User checkUser = db.Users.Find(user.Id);

    if (user == null || checkUser == null)
    {
        throw new ArgumentNullException("user was null");
    }

    return Task.Factory.StartNew(() =>
    {
        db.Users.Remove(user);
        db.SaveChanges();
    });
}

Where db is your DbContext. Hopefully this helps you as much as it helped me, it's a far nicer solution than rolling your own Auth system.