ReactJS FlexGridFilter 선택된 필터 항목 유지
추천0 비추천 0
페이지 정보
작성자 솔루션
작성일 2022-05-26 16:50 조회 2,522회
댓글 0건
제품 버전 : 5.20201.680
컨트롤 이름 : FlexGrid, FlexGridFilter
본문
관련링크
FlexGrid를 사용하였고 특정 컬럼에 필터를 설정했습니다.
해당 필터는 API문서의 생성자를 이용한 것이 아닌 <FlexGridFilter/>를 <FlexGrid/>밑에 적용하여 구현했습니다.
[아래 코드와 같이..]
<FlexGrid
initialized={gridInitial}
// attributes
id={gridSchema.id}
ref={ref}
selectionMode={gridSchema.selectionMode}
currentItem={null}
imeEnabled={true}
itemsSource={gridSchema.itemsSource}
showMarquee={showMarquee} 이하 속성들 생략...
>
{gridSchema.columns.map((item, idx) => {
return (
<FlexGridColumn
// cellTemplate={
// CellMaker.makeButton({
// click: (e, ctx) => alert('Clicked Button ** ' + ctx.item.country + ' **')})
// }
cssClassAll={item.cssClassAll}
width={item.width}
align={item.align}
isReadOnly={item.isReadOnly}
header={item.header}
binding={item.binding}
dataMap={item.dataMap}
key={idx}
/>
);
})}
{hasFilter && <FlexGridFilter filterApplied={editingFilter} initialized={filterInit} />}
</FlexGrid>그리고 input박스에 글자를 입력 받아 해당 컬럼을 필터링했습니다.
[아래 코드와 같이...]
const gridRef = useRef(); // gridRef는 forwardRef로 감싸 자식까지 내려 flexGrid에 설정
gridRef.current.control.collectionView.filter = item => {
필터링 블라블라~
}모든 것이 동작되는 것처럼 보입니다. 동작은 됩니다.
문제는 FlexGridFilter컴포넌트를 이용한 필터에서 조건을 설정한 후 적용하면
정상적으로 필터링이 됩니다만,
위의 코드를 이용한 사용자 입력에 의한 글자로 또 한번 필터를 작동시키면
FlexGridFilter의 필터 적용값이 풀려버립니다.(정확히는 UI상에 필터 적용값은 체크된 상태)
문서를 보니 apply()를 이용하면 되지 않을까 하는데, 이것을 어떻게 끄집어 낼 수 있는지 모르겠네요..
이미 공통화가 된 grid라서 큰 구조를 바꿀순없을것같습니다..
댓글목록
등록된 댓글이 없습니다.
2 답변
