2012-06-20 41 views
9

Estoy trabajando con KendoUI MVC en MVC3.¿Cómo puedo establecer y obtener el valor de una lista desplegable en una cuadrícula en Kendo UI MVC?

Logré obtener un menú desplegable en una columna de la cuadrícula. Pero no tengo ni idea de cómo establecer el valor seleccionado, y cuando lo guardo no guarda el valor seleccionado.

La rejilla

@using Perseus.Areas.Communication.Models 
@using Perseus.Common.BusinessEntities; 


<div class="gridWrapper"> 
    @(Html.Kendo().Grid<CommunicationModel>() 
     .Name("grid") 
     .Columns(colums => 
     { 
      colums.Bound(o => o.communication_type_id) 
       .EditorTemplateName("_communicationDropDown") 
       .ClientTemplate("#: communication_type #") 
       .Title("Type") 
       .Width(180); 
      colums.Bound(o => o.sequence).Width(180); 
      colums.Bound(o => o.remarks); 
      colums.Command(command => command.Edit()).Width(50); 
     }) 
     .Pageable() 
     .Sortable() 
     .Filterable() 
     .Groupable() 
     .Editable(edit => edit.Mode(GridEditMode.InLine)) 
     .DataSource(dataSource => dataSource 
      .Ajax() 
      .ServerOperation(false) 
      .Model(model => model.Id(o => o.communication_id)) 
       .Read(read => read.Action("AjaxBinding", "Communication", new { id = @ViewBag.addressId })) 
       .Update(update => update.Action("Update", "Communication")) 
      .Sort(sort => { sort.Add(o => o.sequence).Ascending(); }) 
      .PageSize(20) 
     ) 
    ) 
</div> 

El EditorTemplate "_communicationDropDown

@model Perseus.Areas.Communication.Models.CommunicationModel 


@(Html.Kendo().DropDownListFor(c => c.communication_type_id) 
     .Name("DropDownListCommunication") 
      .DataTextField("description1") 
      .DataValueField("communication_type_id") 
      .BindTo(ViewBag.CommunicationTypes)) 
+1

¿Recibió una y solución? Yo tengo el mismo problema. Puedo mostrar texto en la lista desplegable, ¿Cómo puedo establecer el valor? –

+0

Parece que el problema está resuelto, ¿podría aclarar cuál es el campo "tipo de comunicación"? en su plantilla del cliente? –

+0

Donde está definiendo '.ClientTemplate (" #: communication_type # ")'? ¿Puedes publicar tu controlador de toda la grilla? –

Respuesta

18

creo que esto es importante para señalar es que el nombre DropDownList debe coincidir con el atributo nombre de la columna a cabo. El atributo HTML nombre = "", no el encabezado de la columna. Los atributos de nombre deben coincidir para que esto funcione, ya que sustituye el control de editor predeterminado con otro control proveniente de una plantilla de editor para tomar su lugar durante la operación de edición. no coincide cuando el DOM se serializa de nuevo en el modelo para la operación de actualización, se ignorará el valor del control de la plantilla del editor. Por defecto, es el nombre de la variable de propiedad que aparece en la clase de modelo, a menos que se anule en el marcado.

(Respuesta editada para incluir la operación de registro de inserción).

Aquí es un ejemplo de trabajo:

Clase Modelo:

public class Employee 
{ 
    public int EmployeeId { get; set; } 
    public string Name { get; set; } 
    public string Department { get; set; } 
} 

Vista:

@(Html.Kendo().Grid<Employee>() 
    .Name("Grid") 
    .Columns(columns => 
    { 
     columns.Bound(p => p.Name).Width(50); 
     columns.Bound(p => p.Department).Width(50).EditorTemplateName("DepartmentDropDownList"); 
     columns.Command(command => command.Edit()).Width(50); 
    }) 
    .ToolBar(commands => commands.Create()) 
    .Editable(editable => editable.Mode(GridEditMode.InLine)) 
    .DataSource(dataSource => dataSource 
     .Ajax() 
     .Model(model => model.Id(p => p.EmployeeId)) 
     .Read(read => read.Action("GetEmployees", "Home")) 
     .Update(update => update.Action("UpdateEmployees", "Home")) 
     .Create(create => create.Action("CreateEmployee", "Home")) 
    ) 
) 

plantilla parcial editor de vista, nombre de archivo "DepartmentDropDownList", ubicado en la carpeta EditorTemplates que es específico de esta vista es decir. Inicio \ Vistas \ EditorTemplates \ DepartmentDropDownList.cshtml

@model string 

@(Html.Kendo().DropDownList() 
    .Name("Department") //Important, must match the column's name 
    .Value(Model) 
    .SelectedIndex(0) 
    .BindTo(new string[] { "IT", "Sales", "Finance" })) //Static list of departments, can bind this to anything else. ie. the contents in the ViewBag 

controlador para la operación de lectura:

public ActionResult GetEmployees([DataSourceRequest]DataSourceRequest request) 
{ 
    List<Employee> list = new List<Employee>(); 
    Employee employee = new Employee() { EmployeeId = 1, Name = "John Smith", Department = "Sales" }; 
    list.Add(employee); 
    employee = new Employee() { EmployeeId = 2, Name = "Ted Teller", Department = "Finance" }; 
    list.Add(employee); 

    return Json(list.ToDataSourceResult(request)); 
} 

controlador para la operación de actualización:

[AcceptVerbs(HttpVerbs.Post)] 
public ActionResult UpdateEmployees([DataSourceRequest] DataSourceRequest request, Employee employee) 
{ 
    return Json(new[] { employee }.ToDataSourceResult(request, ModelState)); 
} 

controlador para la operación de creación:

[AcceptVerbs(HttpVerbs.Post)] 
public ActionResult CreateEmployee([DataSourceRequest] DataSourceRequest request, Employee employee) 
{ 
    employee.EmployeeId = (new Random()).Next(1000); 
    return Json(new[] { employee }.ToDataSourceResult(request, ModelState)); 
} 
+1

* Facepalm * No puedo creer que no haya pensado en eso. ¡Cambiar el nombre del menú desplegable por el nombre de la columna correspondiente funciona como un encanto! ¡Muchas gracias! – bjornruysen

+0

No puedo encontrar ningún buen ejemplo de EditorTemplateName. ¿Puedes aclarar qué es "DepartmentDropDownList"? una vista parcial o ascx, y en qué carpeta debo colocarlo? –

+1

Calculado. Es necesario colocarlo en la carpeta EditorTemplates para la carpeta de la vista del controlador actual (o común). –

Cuestiones relacionadas