켄도 그리드를 생성시에 들어가는 값이 null 일때 '--' 라든가 '값없음' 이라던가 하는 내용을 넣어야 할 때가 있다.


물론 DB에서 쿼리로 뽑아올때 조건을 주어 null 일 경우 대체문자를 사용 할 수 있지만 


뽑아온 데이터 리스트끼리 사칙연산을 해야 하는 경우 중간에 들어가있는 string 문자열이 문제가 될 수도 있다.


혹은 쿼리에 손을 대지 못하는 경우도 있을 수 있다.



방법은 간단하다. 이런 기능이 있는줄 모르기 때문에 못쓰는 거지 있는줄 안다면 쉽게 사용이 가능하다.



1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
 

var nullTypeString = '--';

 $("#grid").kendoGrid({
       dataSource: {
           type: "odata",
           transport: {
               read: "데이터 가져올곳"
           },
           pageSize: 20
       },
       height: 550,
       groupable: true,
       sortable: true,
       pageable: {
           refresh: true,
           pageSizes: true,
           buttonCount: 5
       },
       columns: [{
           field: "record_DATE",
           title: msgData.data('elecdata'), //날짜
           locked: true,
           lockable: false,
           width: 120,
           attributes: {
               style: "text-align: left;"
             }
       },{
           field: "tag_NAME",
           title: msgData.data('tagname'), //태그명
           locked: true,
           lockable: false,
           width: 120,
           attributes: {
               style: "text-align: left;"
             }
       }, {
           field: "sum_VAL",
           title: "Sum",
           locked: true,
           format:"{0:n2}",
           template:kendo.template("#if (sum_VAL != null) {# #=sum_VAL# #} else {# #="+nullTypeString+"# #}#"),
           width: 120,
           attributes: {
               style: "text-align: right;"
             }
       }, {
           field: "avg_VAL",
           title: "Avg",
           format:"{0:n2}",
           template:kendo.template("#if (avg_VAL != null) {# #=avg_VAL# #} else {# #="+nullTypeString+"# #}#"),
           locked: true,
           width: 120,
           attributes: {
               style: "text-align: right;"
             }
       },{
           field: "min_VAL",
           title:"Min",
           format:"{0:n2}",
           locked: true,
           width: 120,
           template:kendo.template("#if (min_VAL != null) {# #=min_VAL# #} else {# #="+nullTypeString+"# #}#"),
           attributes: {
               style: "text-align: right;"
             }
       },  {
           field: "max_VAL",
           title: "Max",
           format:"{0:n2}",
           template:kendo.template("#if (max_VAL != null) {# #=max_VAL# #} else {# #="+nullTypeString+"# #}#"),
           locked: true,
           width: 120,
           attributes: {
               style: "text-align: right;"
             }
       }]
   });
cs




위와 같이 코딩하면 된다. 중요한건


columns 의


template:kendo.template("#if (max_VAL != null) {# #=max_VAL# #} else {# #="+nullTypeString+"# #}#")


이 부분이다.



해당 컬럼의 들어오는 필드의 값이 null이 아닐경우 값을 나타내고 그것이 아니라면 nulltypeString 변수값을 넣는다는 설정이다.

저작자표시 비영리

'Yame Programmer > CSS & UI Plugin' 카테고리의 다른 글

[kendo ui] 켄도 ui 라인차트 bullet(원) 제거 하기  (0) 2016.06.21
[kendo ui] 켄도 ui 차트 색상 지정하기  (0) 2016.06.21
[kendo ui] 차트 valueAxes 라벨 위치 지정 하기  (0) 2016.06.20
[켄도ui] 차트 배경 없애는 방법, 배경 투명으로 만들기  (0) 2015.07.13
[CSS 퍼블리싱] ul li 간격 없애기  (2) 2015.06.19

+ Recent posts

티스토리툴바