Kendo网格控件中的DropDownList(通过ClientTemplate) [英] DropDownList in kendo grid control (by ClientTemplate)
问题描述
我需要像对待EditorTemplateName一样对ClientTemplate采取行为. 所以我想做这样的事情:
I need to make behavor for ClientTemplate like we have for EditorTemplateName. So I want to make something like this:
模板:
@(
Html.Kendo().DropDownListFor(m => m)
.BindTo((SelectList)ViewData["ExamResults"])
.Template("#:Value# #:Text#")
.DataTextField("Text")
.DataValueField("Value")
.Events(e => e
.Change("examResultOnDropDownChange")
.Open("examResultOnOpen"))
)
并将列添加到网格中:.EditorTemplateName("ExamResultGridForeignKey")
And adding column into grid: .EditorTemplateName("ExamResultGridForeignKey")
但我要:.ClientTemplate("ExamResultGridForeignKey")
或类似的东西(但它不起作用):
but I want to: .ClientTemplate("ExamResultGridForeignKey")
or something like that (but it doesnt work):
.ClientTemplate(
Html.Kendo()
.DropDownList()
.Name("#=Id#")
.BindTo((SelectList)ViewData["ExamResults"])
.Template("#:Value# #:Text#")
.DataTextField("Text")
.DataValueField("Value")
)
使用DropDownList以不可编辑的方式(当我们显示值时)创建字段的所有操作看起来就像可编辑的DropDownList.
All that I need to make field with DropDownList in not editable mode (when we display value) looks like editable DropDownList.
推荐答案
这是呈现我的下拉列表的方式. IsInForecast是一个布尔字段. If If所做的所有事情都是根据IsInForecast属性的值选择正确的ddl值(对/错).您将不得不根据需要对其进行调整.
This is how my dropdown list is being rendered. IsInForecast is a bool field. All the If else is doing is having the correct ddl value (true/false) selected based on the value of the IsInForecast property. You're gonna have to tweak it to your needs.
columns.Bound(m => m.IsInForecast).Title("Is Forecasted").ClientTemplate(
"# if (IsInForecast == true) { #" +
"<select id='#= OrderId #' onchange=save('#= OrderId #'); style='Width: 80px; color: 'navy' > " +
"<option id='yes' selected value='1'>Yes</option>" +
"<option id='no' value='0'>No</option>" +
"</select>" +
"# } else { #" +
"<select id='#= OrderId #' onchange=save('#= OrderId #'); style='Width: 80px; color: 'navy' > " +
"<option id='yes' value='1'>Yes</option>" +
"<option id='no' selected value='0'>No</option>" +
"# } #"
);
在看到"<select id='#= OrderId #'
的位置,该位置将ddl ID字段设置为,以便您知道正在编辑的下拉列表/记录. onchange=save('#= OrderId #');
正在调用JS函数,该函数将模型属性OrderId传递给该方法.要获得刚刚更改的正确ddl的选定值,可以执行此操作.
Where you see "<select id='#= OrderId #'
that is setting the ddl ID field to so you know which dropdownlist/record you are editing. onchange=save('#= OrderId #');
is calling a JS function that passes the model property OrderId to the method. To get the selected value of correct ddl you just changed you can do this.
save(orderId) function{
var ddl = # + orderId;
var getSelectedValue = $(ddl).val();
}
这将呈现标准DDL.您可以在此处查看文档
This will render a standard DDL. You can check out the documentation here
http://demos.telerik.com/kendo-ui/web/grid/editing-custom.html
这篇关于Kendo网格控件中的DropDownList(通过ClientTemplate)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!