ASP.NET MVC: привязка модели и запрос AJAX

Question

У меня есть кнопка:

<a id="2" class="modalInput specialbutton" href="/Employee/Delete/2" rel="#yesno"><img src="/Content/Images/application_delete.png" alt="Delete" /></a>

JavaScript для кнопки:

var buttons = $("#yesno button").click(function (e) {
                var yes = buttons.index(this) === 0;
                if (yes) {
                    $.ajax({
                        url: overlayElem.attr('href'),
                        success: function (data) {
                            $("#gridcontainer").html(data);
                        }
                    });
                }
            });

Удалить действие:

public ActionResult Delete(int id)
{
    DeleteTeamEmployeeInput deleteTeamEmployeeInput = new DeleteTeamEmployeeInput { TeamEmployee = id };

    return Command<DeleteTeamEmployeeInput, TeamEmployee>(deleteTeamEmployeeInput,
        s => RedirectToAction<EmployeeController>(x => x.Index(1)),
        f => RedirectToAction<EmployeeController>(x => x.Index(1)));
}

Проблема в id параметр. Было бы неплохо использовать напрямую DeleteTeamEmployeeInput.

public ActionResult Delete(DeleteTeamEmployeeInput deleteTeamEmployeeInput )
{
    return Command<DeleteTeamEmployeeInput, TeamEmployee>(deleteTeamEmployeeInput,
        s => RedirectToAction<EmployeeController>(x => x.Index(1)),
        f => RedirectToAction<EmployeeController>(x => x.Index(1)));
}

Когда я использую объект Complext, он всегда нуль. Простой тип int работает нормально.

Как использовать сложный тип для моего действия удаления?

Класс deleteTeamEmployeeInput:

public class DeleteTeamEmployeeInput
{
    public int TeamEmployee { get; set; }
}

Кнопка удаления:

public static string DeleteImageButton(this HtmlHelper helper, int id)
{
    string controller = GetControllerName(helper);
    string url = String.Format("/{0}/Delete/{1}", controller, id);

    return ImageButton(helper, url, "Delete", "/Content/Images/application_delete.png", "#yesno", "modalInput", id);
}

Answer 1

Вам определенно нужно отменить результат действия по умолчанию, возвращая False от вашего обратного вызова, или ваш запрос AJAX может даже не иметь времени для выполнения, прежде чем вы перенаправляете. Что касается отправки всего объекта (который содержит только один TeamEmployee целое число соответствует), вы можете сделать это:

// that selector seems strange as you don't have a button inside your anchor
// but an <img>. You probably want to double check selector
var buttons = $('#yesno button').click(function (e) {
    var yes = buttons.index(this) === 0;
    if (yes) {
        $.ajax({
            url: this.href,
            success: function (data) {
                $("#gridcontainer").html(data);
            }
        // that's what I was talking about canceling the default action
        });
        return false;
    }
});

а затем генерируйте свой якорь так, чтобы он включал этот параметр:

<a href="<%: Url.Action("delete", "employee", new { TeamEmployee  = "2" }) %>" id="link2" class="modalInput specialbutton" rel="#yesno">
    <img src="<%: Url.Content("~/Content/Images/application_delete.png") %>" alt="Delete" />
</a>

Теперь вы можете безопасно иметь:

public ActionResult Delete(DeleteTeamEmployeeInput deleteTeamEmployeeInput)
{
    ...
}

Замечание: id="2" В вашем якоре не является действительным идентификатором.