无法从 KendoUI 获取 Post 值答案

【问题标题】：Cannot get Post value from KendoUI无法从 KendoUI 获取 Post 值
【发布时间】：2019-04-11 04:37:57
【问题描述】：

我关注https://demos.telerik.com/kendo-ui/multiselect/addnewitem 使用 KendoUI 多选添加新项目

控制器：

    [HttpPost]
    [Route("admin/blog/PostTag")]

    public IActionResult PostTag([FromForm]TagModel models)
    {            
        return Ok();
    }

模型总是得到空值，我也尝试不使用 [FromForm] PostTag(TagModel models) 或使用 [FromBody] 但它不起作用。

TagModel 类：

public class TagModel
{
    public int Id     {get;set;}
    public string Tag { get; set; }
}

查看页面上的 KendoUi：

 <select asp-for="Tag" data-placeholder="Chọn tag"></select>

                    <script id="noDataTemplate" type="text/x-kendo-tmpl">
                        # var value = instance.input.val(); #
                        # var id = instance.element[0].id; #
                        <div>
                            No data found. Do you want to add new item - '#: value #' ?
                        </div>
                        <br />
                        <button class="k-button" onclick="addNew('#: id #', '#: value #')" ontouchend="addNew('#: id #', '#: value #')">Add new item</button>
                    </script>
                    <script>
                        function addNew(widgetId, value) {
                            var widget = $("#" + widgetId).getKendoMultiSelect();
                            var dataSource = widget.dataSource;

                            if (confirm("Are you sure?")) {
                                dataSource.add({
                                    Id: 0,
                                    Tag: value
                                });
                                console.log(dataSource);
                                dataSource.sync();
                                //dataSource.one("requestEnd", function (args) {

                                //    if (args.type !== "create") {
                                //        return;
                                //    }
                                //     console.log(args.type)
                                //    var newValue = args.response[0].id;

                                //    dataSource.one("sync", function () {
                                //        widget.value(widget.value().concat([newValue]));
                                //    });
                                //});

                                //dataSource.sync();
                            }
                        }
                    </script>
                   <script>
                        $(document).ready(function () {
                            var crudServiceBaseUrl = "/admin/blog";
                            var dataSource = new kendo.data.DataSource({
                                batch: true,
                                transport: {
                                    read: {
                                        url: "https://localhost:44383/admin/blog/gettags"
                                    },
                                    create: {
                                        url: "https://localhost:44383/admin/blog/posttag",
                                        type: "POST",
                                        dataType: "jsonp" // "jsonp" is required for cross-domain requests; use "json" for same-domain requests
                                    },
                                    parameterMap: function (data, type) {
                                        if (type != "read" && data.models) {
                                            console.log(data.models);
                                            return { models: kendo.stringify(data.models) };
                                        };

                                    }
                                },
                                schema: {
                                    model: {
                                        id: "Id",
                                        fields: {
                                            Id: { type: "number" },
                                            Tag: { type: "string" }
                                        }
                                    }
                                }
                            });

                            $("#Tag").kendoMultiSelect({
                                filter: "startswith",
                                dataTextField: "Tag",
                                dataValueField: "Id",
                                dataSource: dataSource,
                                noDataTemplate: $("#noDataTemplate").html()
                            });
                        });
                    </script>

【问题讨论】：

您似乎正在传递一个表单字段“模型”，其中一个 JSON 对象（包括 Id 和 Tag）作为其值。为了使它与您的 C# 匹配，我希望 Id=ABC&Tag=DEF 作为原始请求正文（单击您在 Chrome 中突出显示的框中的“查看源代码”）
谢谢，查看源代码看起来像这样 models=%5B%7B%22Id%22%3A0%2C%22Tag%22%3A%22fghdfgdf%22%7D%5D
恐怕我对剑道 UI 不熟悉，所以无法提供建议。我只能在请求级别说明问题所在。猜测一下（基于已经生成的内容），尝试将 return { models: kendo.stringify(data.models) }; 替换为 return data.models; 或者（可能更好），切换到使用 JSON 而不是表单正文。
This post 似乎涵盖了发送 JSON。您需要在 C# 中将 [FromForm] 更改为 [FromBody] 以支持该功能。
return data.models 给出未定义，[FromBody] 给出 415 状态不受支持的媒体类型虽然我可以从 Postman 测试 post 方法，但它适用于 application/json。真正令人困惑的情况。

标签： c# asp.net asp.net-core kendo-ui

【解决方案1】：

我不知道为什么无法从 Kendo 中获取值，所以我改为从 Request 中检索数据。

【讨论】：

你可以试试：public IActionResult PostTag([FromForm]List<TagModel> models) { return Ok(); }
我真的不明白您为什么要在表单正文中发送 JSON。你真的应该要么发送表单数据，要么发送 JSON，而不是两者。