0

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>
}

1 Answer 1

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.

Sign up to request clarification or add additional context in comments.

8 Comments

Could you elaborate on 'create your form inside this element'
sorry, I pasted some code but for some reason it doesnt show up, I'm editing now
wouldn't that be a bit redundant? I already have my model defined and is being called at $(this).load('@Url.Action("CreateUser")');
You are right, so what does this partial contains? is it a form?
in the data just put $("form").serialize() and it will send the values of the form.
|

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.