Question

How exactly should data from the jquery dialog be passed to the Controller? I’m unsure what to put for the data (see Index.cshtml code)

Controller

public ActionResult CreateUser() {
        return PartialView("_Create", new RegisterModel());
    }

[HttpPost]
public ActionResult CreateUser(RegisterModel user) {
    //...
}

Index.cshtml

<script type="text/javascript">
$(document).ready(function () {
    $('#dialog').dialog({
        //...dialog information
        open: function(event, ui) {
            $(this).load('@Url.Action("CreateUser")');
        },
        buttons: {
            "Submit": function () {
                $.ajax({
                    url: 'Users/CreateUser',
                    type: 'POST',
                    data: /* What is passed here? */,
                });
            }
        }
    });

    $('#btnCreate').click(function (e) {
        e.preventDefault();
        $('#dialog').dialog('open');
    });

});
</script>

@Html.ActionLink("Create New User", "CreateUser", null, new { id= "btnCreate" })
<div id="dialog" title="Create User" style="overflow: hidden;"></div>

—Edit—
here’s the model that’s being called from the open function

Model

public class RegisterModel {
    [Required]
    [Display(Name = "User name")]
    public string UserName { get; set; }

    [Required]
    [DataType(DataType.EmailAddress)]
    [Display(Name = "Email address")]
    public string Email { get; set; }

    [Required]
    [StringLength(100, ErrorMessage = "The {0} must be at least {2} characters long.", MinimumLength = 6)]
    [DataType(DataType.Password)]
    [Display(Name = "Password")]
    public string Password { get; set; }

    [DataType(DataType.Password)]
    [Display(Name = "Confirm password")]
    [Compare("Password", ErrorMessage = "The password and confirmation password do not match.")]
    public string ConfirmPassword { get; set; }

    [Required]
    [Display(Name = "Roles")]
    public string RolesId { get; set; }
    public IEnumerable<SelectListItem> RolesItem {
        get { return new SelectList(Roles.GetAllRoles()); }
    }
}

partial view

@model MvcApp.Models.RegisterModel

@{
    ViewBag.Title = "Register";
}

<h2>Create a New User</h2>
<p>
    Passwords are required to be a minimum of @Membership.MinRequiredPasswordLength characters in length.
</p>

<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>

<div id="CreateModel"></div>

@using (Html.BeginForm()) {
    @Html.ValidationSummary(true, "Account creation was unsuccessful. Please correct the errors and try again.")
    <div>
        <fieldset>
            <table>
                <tr>
                    <td>@Html.LabelFor(m => m.UserName)</td>
                    <td>@Html.EditorFor(m => m.UserName)</td>
                    <td>@Html.ValidationMessageFor(m => m.UserName)</td>
                </tr>
                ... more fields... 

            </table>
        </fieldset>
    </div>
}

Answer 1

I supposed you want to show the form to create a user in the dialog, if that so, just create your form inside this <div id="dialog" title="Create User" style="overflow: hidden;"></div> element as normal, just make sure you use javascript validation, otherwise the page will be refreshed and the dialog will get lost if the users submits invalidad information.