【问题标题】:DataTables Editor In MVCMVC 中的数据表编辑器
【发布时间】:2018-11-15 19:03:25
【问题描述】:

我想使用 DataTables Editor,但我想完全控制回发而不是让 Editor-Server 处理它。有没有办法做到这一点?我能够在客户端的 Ajax 中指定 url,它确实回发到控制器,唯一的问题是我不知道如何从调用中获取数据。 这是 Ajax 部分:

 $(document).ready(function () {
    editor = new $.fn.dataTable.Editor({
        ajax: ({
            url: "/../AnyController/Update",
            dataType: "json",
            contentType: "application/json",
            type: 'POST'
        }),
        formOptions: {
            inline: {
                onBlur: true,
                submit: 'all'
            }
        },
        table: "#timetracker",
        fields: [
            {
                label: "Date1:",
                name: "Date1"
            },
            {
                label: "Comment 1:",
                name: "Comment1",
                type: "textarea"
            }
        ]
    });

这是Contoller方法:

[HttpPost]
        public JsonResult Update(EditorReturnData wtd)
        {
            return Json(wtd);
        }

我尝试过使用各种其他方法签名,但 wtd 的值始终为空。我只是通过传递 Json 数据来加载表没有问题,但是如何从数据表编辑器接管更新过程却让我望而却步。

我有一个更新。我无法弄清楚 Get、Post 和 Put 如何都使用相同的控制器方法,并且该方法不带参数,即使是 Post 和 Put。最后我发现 Editor 正在传递 Header 中的数据,并且可以使用 Request.Body 访问它。从那里开始执行实际更新的必须是 Datatables dll。

【问题讨论】:

    标签: visual-studio model-view-controller jquery-datatables-editor


    【解决方案1】:

    enter code here我发现最好的方法是从 ajax 回发到 Post 和 Put 的不同控制器,您可以通过以下方式访问 HttpRequest 正文中的返回数据。

     public ActionResult Rest(HttpRequest request)
            {
                var stream = request.Body;
                string url = new StreamReader(stream).ReadToEnd();
                string newUrl;
                while ((newUrl = Uri.UnescapeDataString(url)) != url)
                    url = newUrl;
    

    我从 Datatables Dot Net Core Demo Rest 示例中将此代码添加到 RestController,该示例可以从 https://editor.datatables.net/ 下载

    Ajax 是这样的

    editor = new $.fn.dataTable.Editor( {
        ajax: {
            create: {
                type: 'POST',
                url:  '/api/rest/create'
            },
            edit: {
                type: 'PUT',
                url:  '/api/rest/edit'
            },
            remove: {
                type: 'DELETE',
                url:  '/api/rest/remove'
            }
        },
    

    【讨论】:

    • 为了完整起见,返回的数据如下所示:action=edit&data[row_43][first_name]=Bruno&data[row_43][last_name]=Nash&data[row_43][position]=Software+Engineer&data[row_43 ][office]=London&data[row_43][extn]=6222&data[row_43][start_date]=2011-05-03&data[row_43][salary]=163500
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-05-07
    • 2011-07-04
    • 1970-01-01
    • 2010-11-16
    相关资源
    最近更新 更多