kendo ui mvc网格editortemplate问题 [英] kendo ui mvc grid editortemplate issue

问题描述

我试图做的是：

1. 我有一个Kendo UI控件，如DatePicker（s），Dropdownlist （s），NumericTextBox（s）在页面的前半部分




2. 后半部分有一个Kendo UI MVC Grid控件

   
   
   
   
   
   • 这个Kendo UI网格控件有8列，其中2列有Kendo下拉列表（EditorTemplate）和CheckBox（EditorTemplate）。
     
   • Kendo UI Grid控件是Ajax绑定。
   
   



3. 当点击保存按钮时，Kendo UI控件的所有值（前半部分）和Kendo UI网格控件（后半部分）一起通过Ajax Post作为Json对象发布到控制器。

我正在使用上述过程的模型绑定

问题或我遇到的问题：

与其他Kendo UI控件的表单的前半部分正确地将其值发布到控制器，但Kendo UI Grid正在发布一些列值的一些问题

• 具有十进制数据类型的Kendo UI Grid中的列不会发布值




• 选中的EditorTemplate控件像CheckBox和kendo下拉菜单显示值[Object Object] for dropdownlist和布尔值而不是复选框控件的实际值。

>我怀疑你希望Grid作为Form的一部分。通常情况下，网格通过ajax进行交互，而不是通过批量表单提交与其他控件 - 从表单中解包。这可能会让你头痛。




上半场：



尝试使用Kendo（）。DatePickerFor ），Kendo（），DropDownListFor（）等等。你不需要通过.Name（）明确地命名这些Kendo控件。这将帮助你进行模型绑定。





下半场：





使用除十进制以外的其他数据类型。你认为这很难？尝试使用TimeSpan类型来计算时间，而不需要附加日期（成年男性在哭）。



您通常不需要布尔型/复选框的EditorTemplate。

  columns.Bound（b =>>）使用这个技巧（假设您使用Razor，因为您没有留下任何代码）。 b.IsActive）.ClientTemplate（< input type ='checkbox'$ {IsActive == true？checked ='checked'：''} disabled />）; 
  

您的Grid DDL最好的选择是


  columns.ForeignKey（b => b.CustodianIdPrimary，Model.Custodians，Id，FullName）。EditorViewData（new {ProjectId = Model.ProjectId}）。EditorTemplateName CustodianDropDownList）; 
  

其中Model.Custodians是所有可能项目的列表。然后，您可以将EditorTemplate绑定到此List，或者在您需要此DDL中的子集时创建ajax调用来填充，如下所示：



  @model int 
 @（Html.Kendo（）。DropDownList（）
 .Name（ViewData.TemplateInfo.GetFullHtmlFieldName（））
 .DataValueField（Id）
 .DataTextField（FullName）
 .OptionLabel（Unassigned）
 .DataSource（dataSource => dataSource 
 .Read（read => read.Action（ReadProjectCustodiansDdl ，SysMaint，new {projectId = ViewData [ProjectId]}））
）
）
  

但是这里是Kendo提供的例子



  @model object 
 @（
 Html.Kendo（）。DropDownListFor（m => m）
 .BindTo（（SelectList）ViewData [ViewData.TemplateInfo.GetFullHtmlFieldName（）+_Data]）
）
  

请注意，在我的初始列中使用EditorViewData参数.ForeignKey用于此ea很好地传递整个列表。





祝你好运！




What I am trying to do :

1. I have a form with Kendo UI controls like DatePicker(s), Dropdownlist(s), NumericTextBox(s) on the first half of the page

2. Second half has a Kendo UI MVC Grid control

   • This Kendo UI Grid control has 8 columns in which 2 columns has a Kendo dropdownlist(EditorTemplate) and CheckBox(EditorTemplate).
   • The Kendo UI Grid control is Ajax binding.

3. When the save button is clicked, all the values from the Kendo UI controls(first half) and Kendo UI grid control(second half) together are posted as a Json object via "Ajax Post" to the controller.

4. I am using Model binding for the above process

Issues or the problem I am facing :

The first half of the form with other Kendo UI controls are posting their values properly to the controller, but where as the Kendo UI Grid is having some problems posting some column values

• The columns in the Kendo UI Grid with the datatype decimal is not posting the values

• The EditorTemplate controls like the CheckBox and the kendo dropdown when selected shows the values "[Object Object]" for dropdownlist and the actual value of the boolean rather than the checkbox control.

解决方案

I doubt you want the Grid as part of the Form. Typically the Grid interacts via ajax and not via a batch Form submit with other controls - unwrap it from the Form. This alone may save you a headache.

1st Half:

Try to use Kendo().DatePickerFor(), Kendo().DropDownListFor(), etc. You do not need to explicitly name these Kendo controls via .Name(). This will help you with the model binding.

2nd Half:

Use another data type other than decimal. You think that is tough? Try using a TimeSpan type for time-of-day with no date attached (grown men cry).

You do not need, typically, an EditorTemplate for boolean/checkboxes. Just use this trick (asuming your are using Razor, since you left no code).

columns.Bound(b => b.IsActive).ClientTemplate("<input type='checkbox' ${ IsActive == true ? checked='checked' : ''} disabled />");

Your best bet for your Grid DDLs is

columns.ForeignKey(b => b.CustodianIdPrimary, Model.Custodians, "Id", "FullName").EditorViewData(new {ProjectId = Model.ProjectId}).EditorTemplateName("CustodianDropDownList");

Where the Model.Custodians is a List of all possible items. You can then bind your EditorTemplate to this List, or make an ajax call to populate if you need a subset in this particular DDL, like this

@model int
@(Html.Kendo().DropDownList()
    .Name(ViewData.TemplateInfo.GetFullHtmlFieldName(""))
    .DataValueField("Id")
    .DataTextField("FullName")
    .OptionLabel("Unassigned")
    .DataSource(dataSource => dataSource
        .Read(read => read.Action("ReadProjectCustodiansDdl", "SysMaint", new {projectId = ViewData["ProjectId"]}))
    )
)

But here is the Kendo supplied example

@model object       
@(
    Html.Kendo().DropDownListFor(m => m)        
        .BindTo((SelectList)ViewData[ViewData.TemplateInfo.GetFullHtmlFieldName("") + "_Data"])
)

Note the use of the EditorViewData parameter in my initial columns.ForeignKey, that is used in this eample to pass the whole list.

Good luck!

这篇关于kendo ui mvc网格editortemplate问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！