Отображение динамических изображений в сетке кендо

Question

Я хочу заполнить динамические изображения в сетке кендо. Я получаю данные json.

И я следующий код

var grid = $("#timeSegmentGrid").kendoGrid({ 
    //var icon=''; 
     dataSource: { 
      transport: { 
       read: function (options) { 
        getTimeSegmentList("", onSuccess, null); 
        function onSuccess(responseData) { 
         if (responseData.segments != null) 
          options.success(responseData.segments); 
         else 
          options.success([]); 
        } 
       } 
      }, 
      pageSize: 5 
     }, 
     pageable: { 
      input: true, 
      numeric: false, 
      pageSizes: false, 
      refresh: true 
     }, 
     toolbar: kendo.template($("#template").html()), 
     columns: [ 
      { field: "display_name", title: "&{'Name'}" }, 
      { field: "display_order", title: "&{'Display Order'}" }, 
      { field: "icon", 
       title: "Icon" 
      } 
     ] 
    }).data("kendoGrid"); 

"значок" содержит путь к изображению. Теперь я могу напечатать путь, но я действительно не знаю, как отображать изображение в соответствии с этим путем. Любая помощь высоко ценится.

Answer 1

Вы можете попробовать:

columns : [ 
    { 
     field: "icon", 
     title: "Icon", 
     template: '<img src="#= icon #" alt="image" />' 
    } 
] 

Answer 2

Попробуйте это может быть его полезным

@(Html.Kendo().Grid<TelerikMvcAppCombo.Models.ImageModel>() 
.Name("grdImageModel") 
.Columns(columns => 
{ 
    columns.Bound(c => c.IMAGESIZE_ID).ClientTemplate("<input type='checkbox'  value =#IMAGESIZE_ID# />"); 
    columns.Bound(c => c.IMAGESIZE_NAME).Width(140); 
    columns.Bound(c => c.IMAGESIZE_DESC).ClientTemplate("<img src='" + 
    Url.Content("~/Images/") + "#=IMAGESIZE_NAME#'/>"); 
    columns.Bound(c => c.created_by); 
    columns.Bound(c => c.created_date); 
    columns.Bound(c => c.modified_by); 
    columns.Bound(c => c.modified_date); 
}) 
.HtmlAttributes(new { style = "height: 580px;" }) 
.Scrollable() 
.Groupable() 
.Sortable() 
.Pageable(pageable => pageable 
    .Refresh(true) 
    .PageSizes(true) 
    .ButtonCount(10) 
) 
.DataSource(datasource => datasource 
    .Ajax() 
    .Read(read => read 
      .Action("GetData", "Image") 
     )) 

)