working on a MVC4 project, I'm trying to add a column to my kendo grid that displays an image.
@(Html.Kendo().Grid() .Name("datagrid_Concessions") .Columns(columns => { columns.Bound(c => c.Code).Title(ViewBag.lblCode); columns.Bound(c => c.Description).Title(ViewBag.lblDescription); columns.Template(@
).Title("Image"); }) I've tried that but no luck. Also tried:
columns.Template(@
).Title("Image");
The images aren't shown, whether I define the image src
in the controller or write it directly in the view.
I've checked both this and this question but the images aren't displayed.
Can anyone help?
EDIT
Here's the Concession Model:
public class ConcessionModel { public string Id { get; set; } public string Code { get; set; } public string Description { get; set; } public string TrafficOpeningDate { get; set; } public string CreationDate { get; set; } public string CreationUser { get; set; } public string Image { get; set; } ...
The Image
property is a string that contains something like "C:\whatever\pic.png"
回答1:
Try like this,
columns.Template(e => { }).ClientTemplate("
").Width(140).Title("Image");
DEMO:
View
@(Html.Kendo().Grid().Name("people") .DataSource(dataSource => dataSource .Ajax() .Model(model => { model.Id(m => m.Id); }) .Read(read => read.Action("GetCategory", "Category")) ) .Columns(columns => { columns.Bound(c => c.Id); columns.Bound(c => c.ImageUrl).ClientTemplate("
"); }) )
Model
public class Category { [ScaffoldColumn(false)] public int Id { get; set; } public string Name { get; set; } [UIHint("FileUpload")] [Required] public string ImageUrl { get; set; } public string FileName { get; set; } internal static object ToDataSourceResult(Kendo.Mvc.UI.DataSourceRequest dsRequest) { throw new NotImplementedException(); } }
Controller
public static List Category = new List(); private int _nextid = 4; static CategoryController() { Category.Add(new Category { Id = 1, Name = "Desert", ImageUrl = "Desert.jpg" }); Category.Add(new Category { Id = 2, Name = "Hydrangeas", ImageUrl = "Hydrangeas.jpg" }); Category.Add(new Category { Id = 3, Name = "Tulips", ImageUrl = "Tulips.jpg" }); } public ActionResult Index() { ViewData["Category"] = Category; return View(); } public ActionResult GetCategory([DataSourceRequest] DataSourceRequest dsRequest) { var result = Category.ToDataSourceResult(dsRequest); return Json(result); }
文章来源: Kendo grid image column