PureJS cell 배경색 동적 변경
추천0 비추천 0
페이지 정보
작성자 aarmani 작성일 2023-12-05 16:52 조회 177회 댓글 0건제품 버전 : wijmo/5.20211.781
컨트롤 이름 : wijimo
본문
관련링크
이벤트가 발생하면 그리드를 동적으로 그려주고있습니다.
값에 따라 cell 의 색깔이나 타입을 동적으로 변경해주고 싶은데
어떻게 해야하나요..
HTML
<div class="container-fluid">
<!-- Export button -->
<button class="btn btn-default" id="btnExport">셀 style 동적으으로 변경하기</button>
<!-- FlexGrid -->
<div id="flexGrid" class="grid"></div>
<div id="flexGridFooter" class="gridFooter"></div>
</div>
JS
function init() {
var countries = 'US,Germany,UK,Japan,Italy,Greece'.split(',');
var data = [];
for (var i = 0; i < countries.length; i++) {
data.push({
id: i,
country: countries[i],
sales: Math.random() * 10000,
expenses: Math.random() * 5000
});
}
// 데이터 그리드에 바인딩
var theGrid = new wijmo.grid.FlexGrid('#theGrid', {
autoGenerateColumns: false,
columns: [
{ binding: 'country', header: 'Country', width: '2*' },
{ binding: 'sales', header: 'Sales', width: '*', format: 'n2' },
{ binding: 'expenses', header: 'remark', width: '*', format: 'n2' }
],
itemsSource: data
});
document.querySelector('#btnExport').addEventListener('click', () => {
for (var p = 0; p < theGrid.length; p++) {
var amount = theGrid.getCelldata(i, 1) /// <-- Sales 값
if (amount > 50000 ){ // Sales값에 따라 cell 변경
theGrid.setCellData(p, 2, '▲')
이 위치에서 Sales 값이 표시된 cell (
row : p, col : 1 ) 위치의 폰트색깔 또는 배경색 또는 타입을
동적으로 변경해 표시하고싶습니다. 어떻게 할까요?
이 위치에서 Sales 값이 표시된 cell (
row : p, col : 1 ) 위치의 폰트색깔 또는 배경색 또는 타입을
동적으로 변경해 표시하고싶습니다. 어떻게 할까요?
}else{
theGrid.setCellData(p, 2, '▼')
}
}
}
})
}
댓글목록
등록된 댓글이 없습니다.