I developed a Kendo MVC Grid which displays a pop-up for updates. Popup Edit screen is a Custom template with a dropdown list that calls the controller to populate the . In this case, I am populating the prefixes. The is populated fine, but when I click on a row on the grid to edit an item, I need to pre-select the value in the drop-down. let's say if a particular row has a value of "Mr." as a prefix, I need it to be pre-selected in the popup .
If the use of a @Html.EditorFor(model => model.Prefix), it perfectly populates the editor fine. This doesn't work for Dropdown.
The editor template is called MemberEdit and the code in it is as below:
01.
@model Aamva.Api.Common.WebSite.Models.WebUser
02.
<
div
class
=
"col-lg-2"
>
03.
@Html.LabelFor(model => model.Prefix)
04.
@*@Html.EditorFor(model => model.Prefix)*@
05.
@(Html.Kendo().DropDownList()
06.
.Name("ddlPrefix")
07.
.DataTextField("Prefix")
08.
.DataValueField("PrefixKey")
09.
.DataSource(source =>
10.
{
11.
source.Read(read =>
12.
{
13.
read.Action("ListCustomerPrefix", "Home"); //.Data("additionalPrefixData");
14.
})
15.
.ServerFiltering(true);
16.
})
17.
// .Text(Model.Prefix)
18.
.Value(Model.PrefixKey)
19.
.AutoBind(false)
20.
.HtmlAttributes(new { style = "width: 100%" })
21.
)
22.
</
div
>
23.
<
div
class
=
"col-lg-2"
>
24.
@Html.LabelFor(model => model.FirstName)
25.
@Html.EditorFor(model => model.FirstName)
26.
@Html.ValidationMessageFor(model => model.FirstName)
27.
</
div
>
The Grid code is as shown below:
01.
@(Html.Kendo().Grid<
Aamva.Api.Common.WebSite.Models.WebUser
>()
02.
.Name("membersGrid")
03.
.Columns(columns =>
04.
{
05.
columns.Command(command => { command.Edit(); command.Destroy().Text("EZ Del"); }).Width("15%");
06.
columns.Bound(p => p.CST_KEY).Visible(false);
07.
columns.Bound(p => p.FullName).Width("20%").Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
08.
columns.Bound(p => p.Role).Width("25%").Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
09.
columns.Bound(p => p.Title).Width("20%").Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
10.
columns.Bound(p => p.EmailAddress).Width("20%").Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
11.
columns.Bound(p => p.Prefix).Visible(false);
12.
columns.Bound(p => p.Suffix).Visible(false);
13.
columns.Bound(p => p.RoleKey).Visible(false);
14.
columns.Bound(p => p.OrganizationMemberKey).Visible(false);
15.
}).Filterable(filterable => filterable
17.
.Extra(false)
18.
.Operators(ops => ops
19.
.ForString(str => str.Clear()
20.
.Contains("Contains")
21.
.StartsWith("Starts With")
22.
.IsEqualTo("Is Equal To")
23.
.IsNotEqualTo("Is Not Equal To")
24.
)))
25.
.Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("MemberEdit").Window(w => w.Title("Edit Employee").Width(1100)))
26.
.Pageable(pager => pager.AlwaysVisible(false).PageSizes(new List<
object
> { 5, 10, 15, 20 }))
27.
.Sortable()
28.
.Filterable(ftb => ftb.Mode(GridFilterMode.Row))
29.
.HtmlAttributes(new { style = "width:100%;" })
30.
.DataSource(dataSource => dataSource
31.
.Ajax()
32.
.PageSize(10)
33.
.Events(events => events.Error("error_handler"))
34.
.Model(model => model.Id(p => p.CST_KEY))
35.
.Read(read => read.Action("ListMembers", "Home"))
36.
.Update(update => update.Action("EditingPopup_Update", "Home"))
37.
.Model(model =>
38.
{
39.
40.
model.Field(m => m.Title);
41.
model.Field(m => m.Prefix);
42.
model.Field(m => m.PrefixKey);
43.
model.Field(m => m.Suffix);
44.
model.Field(m => m.FirstName);
45.
model.Field(m => m.MiddleName);
46.
model.Field(m => m.LastName);
47.
model.Field(m => m.OrganizationKey);
48.
model.Field(m => m.FullName);
49.
model.Field(m => m.CustomerId);
50.
model.Field(m => m.OrganizationMemberKey);
51.
model.Field(m => m.EmailAddress);
52.
model.Field(m => m.CST_KEY);
53.
model.Field(m => m.Role);
54.
model.Field(m => m.RoleKey);
55.
model.Field(m => m.RoleList).DefaultValue(new List<
Aamva.Api.Common.WebSite.Models.WebUserRole
>());
56.
}
57.
)
58.
)
59.
)
The Model is as below:
01.
public class WebUser
02.
{
03.
public string CST_KEY { get; set; }
04.
public string EmailAddress { get; set; }
05.
public string Prefix { get; set; }
06.
public string PrefixKey { get; set; }
07.
public string Suffix { get; set; }
08.
public string Title { get; set; }
09.
public string FirstName { get; set; }
10.
public string MiddleName { get; set; }
11.
public string LastName { get; set; }
12.
public string OrganizationKey { get; set; }
13.
public string Role { get; set; }
14.
public string RoleKey { get; set; }
15.
public List<
WebUserRole
> RoleList { get; set; }
16.
}
17.
public class WebUserPrefix
20.
{
21.
public string PrefixKey { get; set; }
22.
public string Prefix { get; set; }
23.
}