Шаблон столбца сетки кендо для столбца со значениями - PullRequest
Новая
       38

Шаблон столбца сетки кендо для столбца со значениями

0 голосов
/ 11 декабря 2018

Моя сетка кендо имеет специальный столбец со значениями: «Неоплаченный», «Платный».Из бэкэнда приходит 0 - означает «Неоплачено», 1 - означает «Оплачено».

Моя конфигурация для этого столбца: 

{
columnMenu: true
encoded: true
field: "Invoice__state"
filterable: {cell: {…}}
resizable: true
sortable: true
title: "State"
type: "string"
values: Array(2)
0: {value: 1, text: "Paid"}
1: {value: 0, text: "Unpaid"}
}

Всегда отлично (рис. 1).

Теперь мне нужно сделать разметку для столбца - красный для Unpaid, зеленый для Paid.Я хочу использовать шаблон для столбца.Я просто добавляю простой шаблон 

template: "<span class="label label-danger">#: Invoice__state #</span>"

Но теперь я вижу 0 или 1 вместо Unpaid или Paid (рис. 2).

Как я могу изменить шаблон для отображения метки вместо значений?

pic1

pic2

1 Ответ

0 голосов
/ 11 декабря 2018

Вы можете сделать с помощью атрибута по условию.

Здесь код для вашей справки.

Блок CSS: 

  <style>
.red{
    color:red;
}

.green {
    color:green;
}
</style>

Блок Javascript: 

<script>
$("#grid").kendoGrid({
columns: [
{ field: "productName" },
{ field: "category", values: [
{ text: "Beverages", value: 1 },
{ text: "Food", value: 2 }
],attributes: {
            class: "#=category ==1 ? 'red' : 'green' # #console.log(data)#"
          } }
],
dataSource: [
{ productName: "Tea", category: 1 },
{ productName: "Ham", category: 2 }
]
});
</script>
...