CellMaker가 포함된 FlexGrid 버튼 열

CellMaker가 포함된 FlexGrid 버튼 열 > 블로그 & Tips

CellMaker가 포함된 FlexGrid 버튼 열

추천0

페이지 정보

작성자 MESCIUS

작성일 2020-03-31 00:00 조회 3,554회 댓글 0건

본문

관련링크

JavaScript 열에 버튼 열을 추가하는 쉬운 방법을 추가했습니다. 마지막 릴리스에서는 cellTemplate 속성을 FlexGrid의 Column 클래스에 추가했습니다. 이 속성을 통해 개발자는 템플릿 리터럴을 사용하여 셀에 대한 사용자 정의 컨텐츠를 정의할 수 있으며, 이는 많은 유연성을 제공합니다.

대부분의 경우 cellTemplate은 formatItem 이벤트보다 간단하고 사용하기 쉽습니다. 그러나 고객들 중 일부는 훨씬 더 관리하기 쉬운 것을 원했습니다.

CellMaker를 사용하여 FlexGrid에 버튼 열을 추가하는 방법을 살펴 보겠습니다. 버튼 열을 만들기 위해 다음과 같이 CellMaker 클래스를 사용합니다.

import { FlexGrid, ICellTemplateContext } from '@grapecity/wijmo.grid';  
 import { CellMaker } from '@grapecity/wijmo.grid.cellmaker';  

 let theGrid = new FlexGrid('#theGrid', {  
     showMarquee: true,  
     autoGenerateColumns: false,  
     columns: [  

         // button with fixed text  
         {  
             binding: 'country',  
             header: 'Custom Button',  
             width: 150,  
             cellTemplate: CellMaker.makeButton({  
                 text: '<b>${item.country}</b> Button',  
                 click: (e, ctx) => {  
                     alert('Clicked Button ' + ctx.item.country)  
                 }  
             })  
         },  
     ]  
 });