2012-06-20 12 views
9

Sto lavorando con KendoUI MVC in MVC3.Come posso impostare e ottenere il valore di un elenco a discesa in una griglia in Kendo UI MVC?

sono riuscito ad ottenere un menu a discesa in una colonna di griglia. Ma non ho idea di come impostare il valore selezionato, e quando lo salvo non salva il mio valore selezionato.

La griglia

@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> 

L'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

Viene visualizzato un y soluzione? Ho lo stesso problema. Sono in grado di mostrare il testo nell'elenco a discesa, Come posso impostare il valore. –

+0

Sembra che il problema sia risolto, potresti chiarire per favore qual è il campo '' communication_type ''? nel tuo cliente? –

+0

Dove si sta definendo '.ClientTemplate (" #: communication_type # ")'? Puoi per favore pubblicare il tuo controller dell'intera griglia. –

risposta

18

Credo che è importante sottolineare è che il nome DropDownList dovrebbe corrispondere all'attributo nome della colonna. Il html attributo nome = "", non è l'intestazione della colonna. il nome attributi deve corrispondere per far funzionare tutto questo, dal momento che si sta sostituendo il controllo editor predefinito con un altro controllo proveniente da un editor di modelli di prendere il suo posto durante l'operazione di modifica. Se i nomi non corrisponde quando il DOM viene serializzato nuovamente nel modello per l'operazione di aggiornamento, il valore dal controllo del modello di editor verrà ignorato. Di default è il nome della variabile di proprietà che appare nella classe del modello, a meno che non venga sovrascritto nel markup.

(risposta modificato per includere l'operazione di registrazione di inserimento).

Ecco un esempio di lavoro:

Classe Modello:

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

Parziale modello di vista redattore, il nome del file "DepartmentDropDownList", che si trova nella cartella EditorTemplates che è specifico di questa vista. vale a dire. Home \ Vista \ 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 

Controller per l'operazione di lettura:

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)); 
} 

Controller per l'operazione di aggiornamento:

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

Controller per l'operazione Crea:

[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 * Non posso credere di non averlo pensato. Cambiare il nome del menu a discesa sul nome della colonna corrispondente funziona come un incantesimo! Grazie mille! – bjornruysen

+0

Non riesci a trovare alcun buon esempio di EditorTemplateName. Puoi chiarire cosa è "DepartmentDropDownList"? una vista parziale o ascx, e in quale cartella dovrei posizionarlo? –

+1

Capito. È necessario posizionarlo nella cartella EditorTemplates per la cartella View del controller corrente (o comune). –