Kendo UI Grid selecting same value as in ClientTemplate in ComboBox EditorTemplate

Question

I have a KendoUI Grid where I am displaying a lot of information. To keep things simple I have redacted it here. On one of these columns I have a name PayManager when it is in display mode. When I click Edit the name column is then dispayed as a ComboBox.

This all works fine. However, there is one thing I cannot work out how to do. I would like it so that when you click on Edit the Selected value in the ComboBox is the same one as is displayed in the ClientTemplate.

Thanks for any help in advance

Grid

@(Html.Kendo().Grid((IEnumerable<TestDirectoryManager.Models.TestDirectoryDetail>) ViewBag.TestDetails)
    .Name("TestGrid")
     .HtmlAttributes(new { style = "height:850px;" })
    .Columns(columns =>
    {
        columns.Bound(m => m.PayManagerId).Width(150).Title("PM").Template(p =>   p.PayManager).EditorTemplateName("PayManagerDropDown");
        columns.Command(command => command.Edit()).Title("Actions");
    })
    .Editable(editable => editable.Mode(GridEditMode.InLine))
    .Filterable()
    .Groupable()    
    .Pageable() // Enable pageing
    .Scrollable(scr=>scr.Height("auto"))
    .Sortable() // Enable sorting
    .DataSource(dataSource => dataSource
            .Server()
            .PageSize(15)
            .Model(model => 
            {
                model.Id(p => p.SomeId);
                model.Field(m => m.PayManagerId);
            })
            // Configure CRUD -->
            .Update(update => update.Action("Update", "Home"))
            // <-- Configure CRUD
    ))

ComboBox - PayManagerDropDown.cshtml

@(Html.Kendo().ComboBox()
        .Name("PayManagerId")
        .Filter(FilterType.StartsWith)
        .HtmlAttributes(new {style = "width:auto;"})
        .Placeholder("Type beginning of name to select new pay manager")
        .DataTextField("FullName")
        .DataValueField("userid")
        .AutoBind(true)
        .Suggest(true)
        .DataSource(source => source.Read(read => read.Action("GetUsers", "Home")).ServerFiltering(false)))

Edit: In the end I got this to work by combining some of Shaz's suggestions with a few changes of my own. However, the stuff regarding ClientTemplate did not seem to work until I changed the DataSource from .Server to .DataSource(dataSource => dataSource.Ajax() Probably not the best fix but it works for now.

Shazhad Ilyas · Answer 1 · 2014-05-14T08:55:13.853

0

Try this....

 columns.Bound(m => m.PayManagerId).Width(150).Title("PM")
 .Template(p =>   p.PayManager).EditorTemplateName("PayManagerDropDown")
 .ClientTemplate("#:PayManagerId.FullName#");


*****Grid Model ****************

public class TestDirectoryDetail{

   public PayManagerListModel  PayManagerId {get; set;}

}

public PayManagerListModel  {

public int userid       {get; set;}
public string FullName  {get; set;}

}

edited May 14 '14 at 08:55

answered May 14 '14 at 08:35

Shazhad Ilyas

1,183
8
14

just to note PayManager is not an object. PayManagerId and PayManager are properties on the model class. I tried variations on your suggestion and they all result in the combobox showing the placeholder text and not the value that is displayed before clicking Edit as being selected. – lostinwpf May 14 '14 at 08:42
you need to make payManagerId a class having 2 properties.. i will edit my post.. – Shazhad Ilyas May 14 '14 at 08:51
as I am binding to the code server side ClientTemplate will not work for me. See http://stackoverflow.com/questions/17140118/kendoui-clienttemplate-in-grid-not-working-in-asp-net-mvc-4. However, even if I change to `columns.Bound(m => m.PayManager).Width(150).Title("DPM").Template(m => m.PayManager.Name).EditorTemplateName("PayManagerDropDown");` using the class with 2 properties as suggested. So now, it displays the name "Jane Smith" in display mode but when I click on the Edit button Type beginning is selected and not the name "Jane Smith" – lostinwpf May 14 '14 at 10:19
then use .Template(@@item.FullName); – Shazhad Ilyas May 14 '14 at 10:22

Kendo UI Grid selecting same value as in ClientTemplate in ComboBox EditorTemplate

1 Answers1