XPLATFORM 101

- Grid > Sum&Round


그리드에서 많이 요구되는 부분이 합계 등의 계산식입니다.

단순히 계산만 처리하는 것뿐 아니라 해당 영역을 다른 영역과 구분되도록

고정시키거나 하단에 위치하게 하는 등의 처리를 필요로 합니다.


엑스플랫폼 그리드에서는 그리드 디자인 과정에서 Sum 영역을 추가할 수 있습니다.

예제에서는 간단하게 3개 컬럼의 Sum 을 추가하고

해당 계산식을 처리하도록 했습니다.


예제에서는 Sum 영역에 설명을 추가하기 위해

병합을 처리했습니다.

그래서 실제 계산식에 접근하려면 서브셀에 접근해야 합니다.

서브셀은 Alt + 더블클릭으로 접근할 수 있습니다.




http://cafe.naver.com/xplatform101/180


XPLATFORM 101

- Grid > Master&Detail


조건 검색에서 자주 활용하는 방법입니다.

조회조건을 구성하는 것이 그냥 나열하면 되는것처럼 보이지만

실제 설계 단계에서 어떻게 작업해주느냐에 따라 생산성에 큰 차이가 있을 수 있습니다.

한달에 한번 정도 접근하는 화면이라면 모르지만 매일같이 쓰는 화면이라면 엄청난 차이가 나겠죠.


예제처럼 아파트 동을 선택하고 해당하는 동의 호수를 선택하는 경우

주요한 작업은 필터링입니다.


이런 작업을 접근하는 방식으로 매번 필요한 트랜잭션을 처리할 수 있습니다.

동을 선택하면 해당 동에 속하는 호수만 가져오는 방식입니다.

하지만 작업이 빈번하고 마스터와 상세 관계가 정적인 경우에는

데이터를 한번에 가져와서 필터링 처리해주는 것이 좀 더 효과적입니다.

function Combo_dong_onitemchanged(obj:Combo, e:ItemChangeEventInfo)

{

if(e.postindex == 0)

{

ds_ho.filter("");

}

else

{

Filter(e.postindex);

Combo_ho.index = 0;

}

}


function Filter(row)

{

var filter_str;

filter_str = "dong == '" + ds_dong.getColumn(row, "name") + "'";

ds_ho.filter(filter_str); // Filtering처리

}

콤보박스에서 onitemchanged 이벤트를 받아서 해당 인덱스값을 필터링 조건에 추가해서 처리합니다.
데이터셋에서 filter 메소드는 해당 조건식을 만족하는 Row 만 보이게 하는 메소드입니다.
filter 메소드는 항상 이전 값을 덮어쓰기 때문에 상태 설정에 유의해야 합니다.
여기에서는 간단하게 동이 같은 값만 보여주도록 설정하고 있습니다.

한가지 흥미로운 것은 전체 선택일 경우에 어떻게 처리할 수 있는지입니다.
전체 항목은 실제 데이터에 담고 있는 항목이 아니기 때문에
임의로 설정하게 됩니다.
일반적으로 index 0 번째에 배치하게 되고 해당 index 값으로 비교하게 됩니다.


이번 예제에서는 전체라는 값을 가지는 데이터셋을 별도로 설정했는데
일반적으로는 데이터를 가져와서 해당 위치에 전체라는 dummy 값을 추가하게 됩니다.

http://cafe.naver.com/xplatform101/179 
XPLATFORM 101

- Grid > 정렬


많이 사용하는 방법이죠. 하지만 사용자에게 직관적인 피드백을 주지 않는다면

무척 혼란스럽게 됩니다.


첫번째 예제는 헤더 영역을 더블클릭하면 해당 부분이 정렬되는 형식입니다.

그리드에서 onheaddbclick 이벤트를 사용합니다.


헤더 텍스트에 ↑,↓ 특수문자를 사용해서 정렬 상태를 표시하고

정렬 처리는 데이터셋에서 keystring 속성을 사용합니다.


keystring은 2가지 작업을 할 수 있습니다.

G는 그룹핑이고 S는 정렬이네요. 기본값은 G입니다.


그룹핑은 나중에 다시 다루어야 할 것 같은데

메뉴얼 상에서는 데이터셋내에 논리적 레코드를 생성한다고 합니다.

일단 여기서는 정렬만 다룰 것이니..ㅠㅠ


순서는 JobType, SortType, ColumnID 입니다. 

S:+column1-column2 로 지정했다면 첫 번째 컬럼을 오름차순으로 정렬하고

정렬된 데이터를 기준으로 동일한 데이터에 대해서 두 번째 컬럼에서 내림차순으로 정렬하게 됩니다.


첫번째 예제에서는 하나의 컬럼만 정렬하니깐 선택할때마다 keystring을 덮어써주면 되겠죠.



두번째 예제는 다중 컬럼에 대한 정렬을 지원합니다.

이를 위해서 특정 버튼 클릭시 화면에 보여지는 컬럼 정보를 넘겨서

showModal() 메소드로 정렬할 항목을 선택하게 하고

선택된 정보를 다시 keystring으로 받아서 처리합니다.


이러한 처리는 첫번째 예제에서 헤더 더블클릭에서도 반영해서 사용할 수 있습니다.

우선순위 처리가 좀 애매하긴 하겠지만 순서대로 처리한다고 전제하면 어렵지 않을듯 합니다.


사용자가 특정 설정을 사전에 정의하고 사용하는 경우라면 두번째 예제를 참고할 수 있고

1회성 정보라면 첫번째 예제가 도움이 될 것입니다.

기능이 있다고 무조건 사용하기 보다는 실제 사용자가 어떤 기능을 필요로 하는지 한번 더 생각해보는 것이 필요합니다.



http://cafe.naver.com/xplatform101/178