syidaxgrid
홈 가격 내 정보

GRID FEATURE

업무 조건으로 필터링

Grid 밖의 업무 조건을 행 판정 함수로 연결합니다. 미완료만 보기, 내 담당 건만 보기처럼 외부 UI에 있는 선택이 표의 결과를 제어할 때 사용합니다.

Markdown 원문 Features

동작 원리와 선택 기준

조건을 가진 외부 변수가 바뀌어도 Grid가 자동으로 알 수 없으므로 refreshExternalFilter로 다시 계산하게 합니다.

코드의 grid는 설치와 연결 장에서 준비한 Grid 요소입니다. 예제마다 필요한 데이터·설정을 확인하고, 코드에서 소개하는 앱 함수와 서버 주소는 프로젝트에 맞게 구현하세요.

예제 1. 수량이 큰 주문만 보기

100 이상만 보여 주는 업무 스위치를 연결합니다.

javascript
let largeOnly = true;
grid.externalFilter = {
  isExternalFilterPresent: () => largeOnly,
  doesExternalFilterPass: row => Number(row.quantity) >= 100
};
await grid.refreshExternalFilter();

결과 확인: 스위치가 켜졌을 때만 판정 함수를 적용합니다. 함수는 원본 행을 수정하지 않고 boolean을 반환해야 합니다.

예제 2. 외부 조건 해제

같은 필터 객체를 두고 외부 변수만 바꿉니다.

javascript
largeOnly = false;
await grid.refreshExternalFilter();

결과 확인: 외부 필터는 해제되지만 열 필터와 빠른 검색이 있으면 그 조건은 남을 수 있습니다.

예제 3. 앱 컨텍스트 변경

로그인 사용자가 바뀌면 외부 필터가 읽는 사용자 정보도 바꾸고 새로 계산합니다. 수명주기 인스턴스를 사용하면 refresh와 destroy로 자원을 정리할 수 있습니다.

결과 확인: 이전 사용자의 조건이 남지 않습니다. 권한상 볼 수 없는 원본 값은 서버에서도 내려주지 않아야 합니다.

조합할 때와 문제를 해결할 때

판정 함수 안에서 비동기 네트워크 응답을 boolean처럼 반환하지 마세요. 필요한 정보를 미리 준비한 뒤 필터를 다시 계산합니다.

서버 전체 검색이 필요한 조건은 서버에도 전달해야 합니다. 외부 필터는 클라이언트에 로드된 행만으로 전체 데이터의 결과를 만들 수 없습니다.

함께 읽기