剑道网格控制中的DropDownList(通过ClientTemplate)

本文关键字：通过 ClientTemplate DropDownList 网格 控制 | 更新日期: 2023-09-27 17:59:16

我需要像EditorTemplateName那样为ClientTemplate创建行为。所以我想做这样的东西：

模板：

@(
     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")

但我想：.ClientTemplate("ExamResultGridForeignKey")或者类似的东西（但它不起作用）：

.ClientTemplate(
                Html.Kendo()
                    .DropDownList()
                    .Name("#=Id#")
                    .BindTo((SelectList)ViewData["ExamResults"])
                    .Template("#:Value# #:Text#")
                    .DataTextField("Text")
                    .DataValueField("Value")
 )

在不可编辑模式下（当我们显示值时），我需要用DropDownList制作的所有字段看起来都像可编辑的DropDown列表。

剑道网格控制中的DropDownList(通过ClientTemplate)

这就是我的下拉列表的呈现方式。IsInForecast是一个布尔字段。If else所做的只是根据IsInForecast属性的值选择正确的ddl值（true/false）。你必须根据自己的需要进行调整。

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的选定值，您可以这样做。

save(orderId) function{
  var ddl = # + orderId;
  var getSelectedValue = $(ddl).val();
}

这将呈现标准DDL。你可以在这里查看文档

 http://demos.telerik.com/kendo-ui/web/grid/editing-custom.html
相关文章：