使用 jQuery post 传递 ViewModel？

Question

我正在尝试在 MVC 应用程序中使用 jQuery 发表一篇文章，根据这里的 SO 答案： 可以使用 jQuery在 ASP.NET MVC 中将 ViewModel 发送到控制器？

区别在于我使用它来删除动态视图中的项目（不用介意我直接发布删除，这是通过授权关闭的站点，我将使用 jQuery 进行确认，我只是不希望用户必须转到新页面）。因此，我需要能够发送 id 和 ViewModel（ViewModel 在删除任何项目之前保存任何添加的项目）。总的来说，我对这个解决方案并不是特别满意，但此时我只需要让它发挥作用！

所以我试图弄清楚如何根据上面的SO帖子发送id和ViewModel，但我不知道如何使用命名参数获取ViewModel。这不起作用：

$(".delete").click(function () {
    $.ajax({
        type: "POST",
        url: deleteurl,
        data: ({id : $(this).closest('tr').find('td:first').text(),vm: $('form').serialize()}),
        cache: false,
        success: function (html) {
            $("#rows").html(html);
        }
    });
    return false;
});

这是 POST 操作方法：

        [HttpPost]
        public ActionResult Delete(int id, LanguageViewModel vm)
        {
            for (int i = 0; i < vm.Languages.Count; i++)
            {
                var language = _repository.GetLanguage(vm.Languages[i].Id); //This is the key, get the original program object to update
                UpdateModel(language, "Languages[" + i + "]");
            }
            _repository.Save();
//Delete code will go here
         return RedirectToAction("Edit", "Languages", new { id = id });
        //return View();
        }

同样，它不起作用，它甚至无法访问调试器中的操作方法。如果我从操作方法中删除 int id 参数，它实际上会到达那里，但 vm = null。我不知道该怎么做，所以任何帮助将不胜感激！

编辑： 抱歉，返回值现在应该是这样的，而不是 return View()。

更新：

在 Darin 的帮助下，它几乎可以工作了：

    [HttpPost]
    public ActionResult Delete(LanguageViewModel vm, FormCollection collection)
    {
        for (int i = 0; i < vm.Languages.Count; i++)
        {
            var language = _repository.GetLanguage(vm.Languages[i].Id); //This is the key, get the original program object to update
            UpdateModel(language, "Languages[" + i + "]");
        }
        _repository.Save(); 
        int id = Int32.Parse(collection["HiddenId"]);
        Language languageToDelete = _repository.GetLanguage(id);
        _repository.Delete(languageToDelete);
        vm.Languages.Remove(vm.Languages.SingleOrDefault(l => l.Id == id));
        _repository.Save();
        return PartialView("LanguageList", vm);
    }

但我已经更改为返回 PartialView （这是我从一开始就应该做的事情，因为这就是 jQuery 所做的 - 加载带有结果的 div）。但问题是，在从操作方法返回此部分视图并使用 jQuery 将其加载到 div 中后， $(".delete").click jQuery 函数不再工作......

有什么想法吗？

Answer 1

您可以尝试在表单中包含一个隐藏字段，该字段将保存 id:

<input type="hidden" name="id" id="hiddenid" value="" />

，然后：

$('.delete').click(function () {
    var id = $(this).closest('tr').find('td:first').text();
    $('#hiddenid').val(id);
    $.ajax({
        type: 'POST',
        url: deleteurl,
        data: $('form').serialize(),
        cache: false,
        success: function (html) {
            $('#rows').html(html);
        }
    });
    return false;
});

可以简化为：

$('.delete').click(function () {
    var id = $(this).closest('tr').find('td:first').text();
    $('#hiddenid').val(id);
    $('#rows').load(deleteurl, $('form').serialize());
    return false;
});

Answer 2

您是否尝试过在发布之前将 id 附加到删除网址？

这样的事情对我有用：

deleturl = deleteurl + "/" + id;

hth，

\ ^ / ill

Answer 3

将 FormCollection 作为第二个参数而不是 viewmodel 传递如何？然后，您可以在保存和/或删除之前对语言对象执行 TryUpdateModel。