I want to display a partial view in a Kendo UI grid cell.
For example, I imagine it like this (I know it doesn't work):
@(Html.Kendo().Grid<ViewModel>()
.Name("grid")
.Columns(columns =>
{
columns.Bound(x => x.Id);
columns.Bound(x => x.Name);
columns.Bound(x => x.Field1);
columns.Template(@<text></text>)
.ClientTemplate(
"<div>'" + Html.Partial("_MyPartialView", x.SubViewModel) + "</div>");
})
.DataSource(dataSource => dataSource
.Ajax()
.Model(model => model.Id(x => x.Id))
.Read(read => read.Action("Read", "Home"))
)
)
I found that I could do it with jQuery which would render the call to an Action Method. But is there a simplest way to do it?
Thanks in advance.
I use a ClientRowTemplate to achieve something similar to the above.
Look at this documentation: http://demos.telerik.com/aspnet-mvc/grid/rowtemplate
Basically I define my Row template in a partial view then I render the partial like this:
@(Html.Kendo().Grid(Model).Name("usersManageGrid")
.Columns(columns =>
{
columns.Bound(c => c.LoginId).Visible(false);
columns.Bound(c => c.FullName).Title("Name").Width(120);
columns.Bound(c => c.Email).Title("Username");
}).ClientRowTemplate(Html.Partial("_TestPartial").ToHtmlString()))
You can still specify and bind to other columns like the documentation shows. You can also pass in your sub view model if you wish as normal;
.ClientRowTemplate(Html.Partial("_TestPartial",x.SubViewModel).ToHtmlString())
The partial view which contains the row template looks like this:
<tr data-uid='#: LoginId #'>
<td>
<span class='description'><b>Name</b> : #: FullName# </span>
</td>
<td>
@Html.Partial("_Test2Partial")
</td>
</tr>
Then you will see I render another partial view for the second column which simply has this in it:
<span style="color:purple;"><b>Email</b> : #: Email# </span>
The end result looks like this:
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.