- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我需要在剑道网格(内联编辑)中使用多选列表,以便用户可以从每行列表中选择多个值。
以下是我的要求:
当用户点击更新/保存按钮时,从多选列表中选择的值应该在后面的代码中可用(在更新 ajax 操作中)以及行的 id。
按照我目前的做法:
我采用的方法类似于在剑道内联网格中使用下拉列表。
我创建了一个编辑器模板,用于在添加/编辑时显示多选。
代码如下:
@model List<Namespace.CompanyConnector>
@using Kendo.Mvc.UI
@(Html.Kendo().MultiSelectFor(c=>c)
.Name("company_connector_id")
.DataTextField("connector_name")
.DataValueField("company_connector_id")
.Placeholder("Select connector...")
.AutoBind(false)
.Value((List<int>)ViewData["SelectedValues"])
.DataSource(source =>
{
source.Read(read =>
{
read.Action("GetCompanyConnectors", "BrandConnector");
})
.ServerFiltering(true);
})
)
@Html.ValidationMessageFor(m => m)
说明:我将模型类列表绑定(bind)到多选并在读取操作中设置数据源。为了在编辑时选择所选值,我创建了一个函数,该函数返回所选值的 ID,并将其放入读取操作的“查看数据”中。
我在我的索引页面中使用了这个编辑器模板,代码如下:
@{Html.Kendo().Grid<Cee.DomainObjects.DomainObjects.BrandConnector>()
.Name("BrandConnectorGrid")
.Filterable()
.Events(e => e.Edit("onEdit"))
.DataSource(dataSource => dataSource
.Ajax()
.Events(e => e.Error("error_handler").RequestEnd("onRequestEnd"))
.ServerOperation(false)
.Model(model =>
{
model.Id(p => p.brand_id);
model.Field(e => e.CompanyConnectorList).DefaultValue(new
List<Cee.DomainObjects.DomainObjects.CompanyConnector>());
})
.Read(read => read.Action("_AjaxBinding", "BrandConnector",new{companyID = 0 }).Type(HttpVerbs.Post))
.Update(update => update.Action("_UpdateBinding", "BrandConnector").Type(HttpVerbs.Post)))
.Columns(columns =>
{
columns.Bound(c => c.brand_connector_id).Width(0).Hidden(true);
columns.Bound(c => c.company_id).Width(0).Hidden(true);
columns.Bound(c => c.brand_id).Width(0).Hidden(true);
columns.Bound(u => u.brand_name).Title("Brand").Width("18%").HtmlAttributes(new { @class = "brkWord", @readonly = "readonly" });
columns.ForeignKey(u => u.connector_name, Model.CompanyConnectorList, "company_connector_id", "connector_name").Title("Connector").Width
("16%").HtmlAttributes(new { @class = "brkWord" }).EditorTemplateName("company_connector_id");
columns.Command(p => p.Edit().Text("Edit").HtmlAttributes(new { @title = "Edit" })).Width("16%").Title("Edit");
})
.Editable(editable => editable.Mode(GridEditMode.InLine).CreateAt(GridInsertRowPosition.Top))
.Pageable(pageable => pageable.Refresh(true).PageSizes(GlobalCode.recordPerPageList).ButtonCount(GlobalCode.PageSize).Input(true).Numeric(true))
.HtmlAttributes(new { @class = "dynamicWidth" })
.Sortable(sorting => sorting.Enabled(true))
.Render();
}
说明:我使用了 ForeignKey。将其绑定(bind)到字符串列“connector_name”。 Connector_name 是我从 Controller 发送的以逗号分隔的 ID 列表。这里使用编辑器模板。
问题:在索引中查看/显示时它工作正常,但编辑不显示选定的值。此外,我们不会在更新点击时在代码后面获得更新值。
这是实现多选列表的正确方法还是我需要将集合属性绑定(bind)为网格中的列?如果我将一个集合属性绑定(bind)为一个列,那么我将如何在显示时显示以逗号分隔的字符串?
最佳答案
试试下面的代码:
function onEdit(e) {
var multiselect = $("#YourMutliselectDropdown").data("kendoMultiSelect");
var IDArray = [];
$(e.model.propertyName).each(function (index) {
var ID = e.model.propertyName[index].id;
IDArray.push(ID);
});
multiselect.value(IDArray);
}
我假设 propertyName
是您收藏的列表,它包含 id
作为属性。
关于asp.net-mvc - Kendo Grid 内联编辑中的多选列表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30067630/
我正在尝试用 Swift 编写这段 JavaScript 代码:k_combinations 到目前为止,我在 Swift 中有这个: import Foundation import Cocoa e
我是一名优秀的程序员,十分优秀!