c# - 通过 ajax.actionlink 使用通过 javascript 创建的 json 数据

Question

我希望能够通过Ajax.ActionLink帮助程序发布通过 javascript 函数创建的 json 数据。

我可以通过直接的 jQuery 代码来完成此操作，但我将在很多地方执行此操作，并想看看在 MVC 中是否有更有效的方法来执行此操作。

工作 jQuery 代码：

 $(function () {
        $("#delete-selected").click(function () {
            var ids= getSelected('ItemGrid'); //this returns a string[]
            var postData = { Ids: courseIds };
            var url = '/Home/DeleteSelected';
            $.ajax({
                url: url,
                traditional: true,
                type: "Post",
                dataType: 'json',
                data: postData
            });
        });
    });

Answer 1

编写一个脚本，使用不显眼的 JavaScript 钩子（如data-属性）来存储设置。

HTML：

<div data-ajax-url='/Home/DeleteSelected' 
     data-ajax-post-data='{function name or json content}'>
....
</div>

jQuery插件

$(document).on("click","[data-ajax-url]", function(){
        var postData =  $(this).data("ajax-post-data");
        var url = $(this).data("ajax-url");
        $.ajax({
            url: url,
            traditional: true,
            type: "Post",
            dataType: 'json',
            data: postData
        });
 }

Answer 2

如果您正在进行 ajax 调用并想使用 MVC 更新 html，我通常会从调用中返回 Partial View。然后使用结果更新当前持有者的 html

服务器端

public ActionResult DeleteSelected(int[] Ids)
{
   //do something
   MyModel model = new Model(); //create object with new data
   return Partial("_PartialViewName", model);
}

Javascript

    $("#delete-selected").click(function () {
        var ids= getSelected('ItemGrid'); //this returns a string[]
        var postData = { Ids: courseIds };
        var url = '/Home/DeleteSelected';
        $.ajax({
            url: url,
            traditional: true,
            type: "Post",
            dataType: 'html',
            data: postData
            success: function(result){
                 $('#MyPartialViewContainer').html(result);
            }
        });
    });