从 ASP.Net MVC 4 中的 Kendo UI MultiSelect 获取 PrimaryId

Question

我刚开始接触 ASP.Net 和 Kendo，非常感谢你们提供的任何帮助。我正在尝试使用 Kendo MultiSelect Widget 来显示员工列表（我已成功管理），使用控制器上的 Json 方法从我的视图模型返回结果集。我希望能够实现的是收集employeeId 的列表，以便我可以将它们发送回控制器进行处理。但是，我似乎只能获取列表中的值而不是 ID。

有人可以就如何实现这一目标给我一些建议吗？

我的 ViewModel 如下所示：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using TrainingKendoUI.Models;
using System.ComponentModel.DataAnnotations;

namespace TrainingKendoUI.ViewModels
{
    public class EmployeeViewModel
    {
        #region Constructors

        public EmployeeViewModel()
        {

        }

        public EmployeeViewModel(TRAINING_EMPLOYEES model)
        {
            this.employeeId = model.EMPLOYEE_ID;
            this.firstName = model.FIRST_NAME;
            this.lastName = model.LAST_NAME;
            this.email = model.EMAIL;
            this.login = model.LOGIN;
            this.fullName = model.FIRST_NAME + " " + model.LAST_NAME;
        }

        #endregion

        #region Properties

        public int employeeId { get; set; }
        public string firstName { get; set; }
        public string lastName { get; set; }
        public string email { get; set; }
        public string login { get; set; }
        public string fullName { get; set; }

        #endregion
    }
}

我的 Json 方法如下所示：

    public JsonResult Employees_Read()
    {
        var model = db.TRAINING_EMPLOYEES;
        var ViewModel = new List<EmployeeViewModel>();

        foreach (var employee in model)
        {
            ViewModel.Add(new EmployeeViewModel(employee));
        }

        return Json(ViewModel, JsonRequestBehavior.AllowGet);
    }

我的观点是这样的：

@model IEnumerable<TrainingKendoUI.Models.TRAINING_EMPLOYEES>

<div>
    <h2>Multiselect Test</h2>
    <label for="required">Required</label>
    @(Html.Kendo().MultiSelect()
        .Name("required")
        .DataTextField("fullName")
        .DataValueField("emplolyeeId")
        .Placeholder("Select Employees")
        .Filter(FilterType.Contains)
        .DataSource(source =>
            {
                source.Read(read =>
                    {
                        read.Action("Employees_Read", "Employee");
                    })
                    .ServerFiltering(true);
            })
        )
        <button class="k-button" id="get">Send Invitations</button>
</div>
<script>
    $(document).ready(function () {
        var required = $("#required").data("kendoMultiSelect");

        var items = $("#required").data("kendoMultiSelect");

        $("#get").click(function () {
            alert("Employees:\n\nIds: " + required.value());
        });
    });
</script>

非常感谢！

Answer 1

您可以使用dataItems 方法：

// get selected dataItems from the control 
var control = $("#required").data("kendoMultiSelect");
var selectedDataItems = control.dataItems();

// create an array that only contains the selected ids
var ids = [];
$(selectedDataItems).each(function() {
   ids.push(this.employeeId); // you can access any property on your model here
});

(demo)