반응형 웹스퀘어그리드2 웹스퀘어 그리드 컨트롤 웹스퀘어 그리드 컨트롤이번 포스팅은 웹스퀘어 Grid 컨트롤 기능을 구현 및 알아본다. 자바스크립트 프레임워크나 라이브러리들은 대부분 그리드(grid)를 자체적으로 구현해 놓은 경우가 대다수다. 만든 이들이 다를 뿐 개념은 거의 비슷하다고 할 수 있다. 1. 공통점으로는 서버에서 가져온 데이터를 갖고 있는 객체가 있다. 2. 그리드는 html 객체다. Grid 객체가 존재한다. 3. 1과 2가 바인딩 또는 매핑 된다. 결국 서버에서 가져온 데이터 객체 + Html로 구현한 그리드 객체 두 개가 서로 매핑되어 상화보완 작용을 한다고 판단하면 된다. 이 원리를 머릿속에 이해하고 있다면 그리 어렵지 않게 제공된 API를 참고해서 일반적으로 많이 사용하는 기능을 충분히 구현할 수 있다. 이번에 구현해 볼 기능은.. 2023. 5. 14. 웹스퀘어 그리드 부모 자식 1:N 조회 구성 웹스퀘어 그리드 부모 자식 1:N 조회 구성 부서정보가 조회되고 해당 부서에 마우스를 클릭하면 하단 사원정보 그리드에 해당 부서의 속한 사원리스트가 나오는 화면을 구성해 본다. 두 가지 방법이 존재한다. 1. 부서정보의 그리드를 클릭할 때마다 서버와 통신을 해서 사원정보를 조회하는 방법 2. 최초에 조회를 할 때, 부서정보 전체와 사원정보 전체를 모두 서버로부터 갖고 와서 사원정보를 필터 형태로 그리드에서 나타내게 하는 방법. 두 가지 방법대로 장단점이 존재하는데. 2번 방법의 경우 데이터가 많다면 문제가 된다. 데이터가 많다면 초기 로딩이 문제가 될 텐데 막상 로딩 후에는 빠르게 필터링이 된다. 1번의 경우 단점은 역시 서버와 통신이 너무 잦다는 것. 하지만 최신 정보를 가져올 수 있다. 처음에는 빠르.. 2023. 5. 5. 이전 1 다음 반응형