Telerik Kendo ui сетка, отображающая html-ячейку вместо сгенерированного управления html

Я пытаюсь использовать новую сетку пользовательского интерфейса Kendo от asp.net mvc 3.

У меня есть таблица, таблица автоматически генерируется с контроллера в asp.net mvc 3.

И отобразите его с помощью сетки Kendo.ui.

Однако у меня есть код html внутри ячеек вместо элементов управления html

Пример:

он отображается в ячейке: <input checked="checked" class="check-box" disabled="disabled" type="checkb.. вместо ввода, код в представлении - @html.input

или <a href="/Admin/Edit">Edit</a> | <a href="/Admin/Details">Details</a> | <a href="/Adm вместо ссылки (код в представлении - это @Html.actionLink)

Как я могу сделать код кодирования html?

Это мой script:

$(document).ready(function() {
    $("#calendrierMatch").kendoGrid({

    });
});

Спасибо

Ответы

Ответ 1

Сетка KendoUI автоматически кодирует содержимое сетки, поэтому вы получаете текст <input type= ... вместо фактического ввода controll.

Вы можете отключить кодировку для данного столбца с помощью опций encoded (см. документацию):

закодировано: Boolean (по умолчанию: true) Указывает, будет ли содержимое столбца бежит. Отключить кодировку, если данные содержат разметку HTML.

Итак, вам нужно что-то вроде:

 $(document).ready(function(){
      $("#grid").kendoGrid({
      //...
        columns: [
           {
               field: "Column containing HTML",
               encoded: false
           }
        ]          
      });
 });

Ответ 2

в привязке модели кендо сетки Razor Html Страница использовать этот код

@Html.Kendo().Grid(Model).Name("GridName").Columns(col =>{
col.Bound(m => m.ID);
col.Bound(m => m.Name);
col.Template(@<text>
        @Html.Raw(HttpUtility.HtmlDecode( item.Text))
    </text>);
})

Ответ 3

You need to add the template feature  of kendo grid.

In the below code i have created a text box inside the cell of kendo grid.


 {
     field: "Total",
     title: "Total",
     width: "40px",
     template: "<input type='text'  class=\"quantity_total\"   id='txtTotal_${ItemId}'    
                name='txtTotal_${ItemId}' maxlength='8'    onkeypress = 'return 
                fnCheckNumeric_total(event,this.id)'  />"  

},