Question

我在Kendo Grid的编辑器模板中使用了Kendo Multiselect，以编辑我的数据模型的int []属性。

以下是模型：

public class Project
{
    ...
    public int[] Staff { get; set; }
    ...
}

包含网格的部分 - 它包含任何数组数据的序列化脚本。这会被正确触发，但此时尝试数组的内容读取为Object，而不是整数。

<script>
function serialize(data) {
    for (var property in data) {
        if ($.isArray(data[property])) {
            serializeArray(property, data[property], data);
        }
    }
}
function serializeArray(prefix, array, result) {
    alert("prefix = " + prefix);
    alert("array = " + array);
    for (var i = 0; i < array.length; i++) {
        for (var property in array[i]) {
            result[prefix + "[" + i + "]." + property] = array[i][property];
        }
    }
    alert("result = " + result);
}
</script>

<div>
    @(Html.Kendo().Grid<ProvostDevelopment.Models.Project>()
        .Name("ProjectGrid")
        .ToolBar(toolbar => toolbar.Create())
        .Columns(columns =>
        {
            columns.Bound(c => c.ID).Hidden();
            columns.Bound(c => c.ProjectName);
            columns.Bound(c => c.StartDate).ClientTemplate("#= kendo.toString(StartDate, \"MM/dd/yyyy\") #");
            columns.Bound(c => c.DueDate).ClientTemplate("#= kendo.toString(DueDate, \"MM/dd/yyyy\") #");
            columns.Bound(c => c.Current);
            columns.Bound(c => c.Complete);
            columns.Command(command => command.Edit().Text("Details")).Width(180);
        })
        .Scrollable()
        .Sortable()
        .Selectable()
        .Pageable(pageable => pageable
            .Refresh(true)
            .PageSizes(true)
            .ButtonCount(5))
        .DataSource(dataSource => dataSource
            .Ajax()
            .Model(model => model.Id(p => p.ID))
            .Read(read => read.Action("Read", "Project"))
            .Create(create => create.Action("Create", "Project"))
            .Update(update => update.Action("Update", "Project").Type(HttpVerbs.Post).Data("serialize"))
        )
        .Editable(editable => editable
            .Mode(GridEditMode.PopUp)
            .TemplateName("ProjectEditor")
        )
        .HtmlAttributes(new { @style = "height:500px; "})
    )
</div>

在项目编辑器中，我尝试了很多东西，包括使用MultiSelectFor或简单的MultiSelect和HiddenFor。数据似乎正确读入，但在通往控制器的路上会发生一些变化。

<script>
function onChange(e) {
    var arrayOfNames = this.value();
    $("#staffHidden").val(arrayOfNames);
}
</script>

...

<div class="col-md-11 details-item">
    @Html.LabelFor(m => m.Staff, new { @class = "col-md-4 details-label" })
    @(Html.Kendo().MultiSelectFor(m => m.Staff)
        //.Name("Staff")
        .DataValueField("ID")
        .DataTextField("FullName")
        .BindTo((System.Collections.IEnumerable)ViewData["Staff"])
        .Events(events => events
            .Change("onChange")
        )
        .HtmlAttributes(new { @class = "col-md-7 details-editor" })
    )
    @Html.HiddenFor(m => m.Staff, new { @id = "staffHidden" })
</div>

当数据最终到达控制器时，Staff属性具有正确的长度，但所有值都设置为0并且ModelState.IsValid条件失败。我知道我可能在编辑器中缺少一些步骤。非常感谢你的帮助。

Answer 1

<script>
    function serialize(data) {
        for (var property in data) {
            if ($.isArray(data[property])) {
                serializeArray(property, data[property], data);
            }
        }
    }
    function serializeArray(prefix, array, result) {
        if(prefix == "Staff"){
            for (var i = 0; i < array.length; i++) {
                result[prefix + "[" + i + "]"] = array[i]["ID"];
            }
        }
    }
</script>

可能是一个hacky解决方案，但它的工作原理，我很沮丧，可以接受它。

在Kendo Grid中将Kendo Multiselect中的数据序列化以在更新时绑定到数组？

1 个答案: