안녕하세요 그레이프시티입니다.
문의 주셨던 내용에 대해서 정리하여 답변 드립니다.
1. formatItem에서 setCellData 설정 문의
=> Wijmo setCellData의 경우, 해당 메서드가 호출되면서 셀의 value 편집하는 과정에 dataType이 맞지 않는 경우, 값이 입력되는 것을 방지하여 해당 현상이 나타나는 것으로추측됩니다.
셀 편집과 관련하여 대체 방안으로 이전에 말씀 드린 것과 같이 해당 요소의 HTML까지 가져오거나 설정할 수 있는 innerHTML 대신 해당 노드가 가지고 있는 텍스트 값을 가져오는 textContent를 이용하여 값을 설정해보시길 바랍니다. 아래 코드를 참고하여 주시길 바랍니다.
initializeGrid(flex) {
flex.formatItem.addHandler((s, e) => {
if (e.panel == s.cells) {
let col = s.columns[e.col];
if(col.header ==="Stocks" && e.row%2===0){
e.cell.textContent = "-"
}
}
})
};
추가적으로 cellTemplate의 삼항연산자로 아래와 같이 값을 설정할 수 있습니다.
function getDeeperColumnGroups() {
return [
{ binding: 'name', header: 'Name', width: 150 },
{ binding: 'currency', header: 'Curr', width: 80, align: 'center' },
{ header: 'Allocation', align: 'center', collapseTo: 'alloc.amount', columns: [
{ binding: 'alloc.stock', header: 'Stocks', format: 'p0', width: 80, cellTemplate: (ctx) =>{ return test(ctx)}},
] },
];
}
function test(ctx){
return ctx.value === -999 ? "-":ctx.value;
}
[CellTemplate을 이용하여 사용자 정의 컨텐츠 만들기]
cellTemplate과 관련된 블로그 글을 공유 드리오니 참고 부탁 드립니다.
2. 셀의 데이터타입 지정방법
=> 특정 셀의 dataType 설정 기능 지원과 관련하여 본사 개발팀과 함께 이야기해본 결과, 아쉽게도 해당 기능에 대한 지원 계획은 별도로 없으며 이는 FlexGrid 객체 모델에서 구현에 제한이 있어 어렵다는 것으로 확인 되었습니다. 다만, 말씀하신 특정 셀의 dataType 문제와 관련하여 정확한 시나리오 및 결과를 공유해주신다면 해결 방법이 있는지 확인 후, 도와 드릴 수 있도록 하겠습니다.
3. 체크박스 병합 처리 문제
=> 문의 주신 이슈의 경우, 확인해본 결과, 안타깝게도 저희 쪽에서 재현이 되지 않아 정확한 원인 파악이 어려운 상황입니다. 아래 코드를 다시 한 번 적용을 해보시고 지속적으로 문제가 발생하시다면 저희 쪽으로 재현 및 디버깅 할 수 있는 샘플을 공유해주시길 바랍니다. 공유해주신 코드를 바탕으로 원인 파악 후, 답변 드릴 수 있도록 하겠습니다.
<FlexGrid
(...)
mergeManager={new RestrictedMergeManager()}
>
(...)
class RestrictedMergeManager extends wjGrid.MergeManager {
getMergedRange(p, r, c, clip = true) {
//
if (p.cellType == wjGrid.CellType.RowHeader) {
let rng = this.getMergedRange(p.grid.cells, r, 1, clip);
let eaderCellRange = new wjGrid.CellRange(r, c);
eaderCellRange.row = rng.row;
eaderCellRange.row2 = rng.row2;
return eaderCellRange;
}
// create basic cell range
var rng = null;
//
// start with single cell
rng = new wjGrid.CellRange(r, c);
var pcol = c > 0 ? c - 1 : c;
//
// get reference values to use for merging
var val = p.getCellData(r, c, false);
var pval = p.getCellData(r, pcol, false);
//
// expand up
while (
rng.row > 0 &&
p.getCellData(rng.row - 1, c, false) == val &&
p.getCellData(rng.row - 1, pcol, false) == pval
) {
rng.row--;
}
//
// expand down
while (
rng.row2 < p.rows.length - 1 &&
p.getCellData(rng.row2 + 1, c, false) == val &&
p.getCellData(rng.row2 + 1, pcol, false) == pval
) {
rng.row2++;
}
//
// don't bother with single-cell ranges
if (rng.isSingleCell) {
rng = null;
}
//
// done
return rng;
}
}
4.동적으로 바인딩 방법 문의
=> 해당 문의는 현재 확인 중에 있으며 업데이트 되는 대로 안내 드리도록 하겠습니다. 답변이 늦어지는 점 죄송합니다.
다른 궁금한 점이 생기면, 문의 주시기 바랍니다.
감사합니다.
그레이프시티 드림
* 그레이프시티(GrapeCity)는 개발자를 위하여 ComponentOne(컴포넌트원), Spread(스프레드), ActiveReports(액티브리포츠), SpreadJS(스프레드JS), Wijmo(위즈모)와 같은 엑셀 스프레드시트 리포팅 그리드와 차트 등 다양한 종류의 .NET JavaScript(자바스크립트) 컴포넌트 툴을 생산하고있는 개발툴 전문 회사 입니다