I have an editor template set up, used in conjunction with a kendo grid. It contains two drop-downlists which use templates and value templates to display images as well as text.
The model contains an ID, which is a foreign key to a separate table, where the images are pulled from. The drop-down source controller creates the image path, and passes this to the drop-down list.
The mark up of one of the drop-downs is:-
<p>
<span class=
"fieldlabel2"
>Trend:</span>@(Html.Kendo().DropDownList()
.Name(
"Trend"
)
.OptionLabel(
"Select trend"
)
.DataValueField(
"ID"
)
.DataTextField(
"ImageDescription"
)
.DataSource(src => src.Read(rd => rd.Action(
"GetTrendsList"
,
"MetricsInput"
)))
.Template(
"#=ImagePath#<span style='margin-left:5px;'>#=ImageDescription #</span>"
)
.ValueTemplate(
"#=ImagePath#<span style='margin-left:5px;'>#=ImageDescription #</span>"
)
)
</p>
When used for editing existing records, the drop-downs work fine. However the insert button on the grid is used, a javascript error is thrown, complaining about 'ImagePath' being undefined.
If the ValueTemplate is commented out, the drop-downs and the edit form work.
What do I need to do to fix this?
Thanks