Question

我正在发布一个表单，并注意到Kendo UI在序列化时会使用表单字段进行复制，并在序列化对象中创建一个重复字段。我想知道是否有人之前遇到过此问题，以及是否有解决方案。

所以，让我们说我想做一个表格的JQuery AJAX帖子。

$.ajax({
    type: "POST",
    url: "/api/MyController",
    data: formData
});

我可以有这样一个简单的表格。

<form id="myForm">
    <input type="text" name="firstName">
</form>

如果我想序列化我的表单数据（在formData变量中使用），我会这样做。

var formData = $('#myForm').serializeArray();

控制台中的输出看起来像这样。

[Object { name="firstName",  value="John"}]

现在问题。如果我正在使用Kendo UI并且我从该输入中输出下拉列表或组合框，并且我尝试序列化该表单，则会识别另一个输入（带有下划线的输入）。

[Object { name="firstName_input",  value="John"}, Object { name="firstName",  value="John"}]

如果您不熟悉，Kendo UI使用简单的输入来创建组合框或下拉列表，并通过远程调用api获取数据。以下是组合框的创建方式。

var firstNameComboBox= $('#firstName').kendoComboBox({
    placeholder: "Select a Name",
    dataTextField: "Name",
    dataValueField: "ID",
    change: myChangeFunction,      //On change event
    dataSource: {
        type: "json",
        transport: {
            read: {
                dataType: "json",
                url: "/api/MyController/MyAction",
                data: { }
            },
        }
    }
}).data("kendoComboBox");

Answer 1

免责声明：我为Telerik / Kendo UI团队工作

预期会出现所描述的行为。基本上，ComboBox呈现第二个包含所选文本的输入元素。窗口小部件使用以下“{name} _input”格式将 name 属性添加到该输入元素。您可能知道输入元素何时具有名称属性，它将变为successful并且表单将发布它。

这样做有利于服务器平台，当出现错误时返回相同的发布页面。这有助于服务器开发人员获取该值并将其作为ComboBox text配置选项返回。

我不相信这会对使用发布值的开发人员造成问题，因为它应该将POST有效负载与模型字段/名称相匹配。

JQuery序列化表单 - Kendo UI复制输入

1 个答案: