FlexGrid 를 열선택 모드로 설정해서 선택한걸 다시 누르면 선택이 해제되도록 하고 싶습니다.
onSelectionChanged event 처리기를 통해 자체적으로 구현을 해보았는데요.
선택 해제를 위해 flexGrid.select(-1, -1) 을 onSelectionChanged 처리기 내에서 수행하면 재귀적인 호출이 발생해서
해당문제를 해결하기 위해 여러가지 상태 변수가 계속 추가되면서 계속 코드가 복잡해 지더라구요.
게다가 마우스를 클릭할 때 선택이 되다보니, 선택후 마우스를 이동하면 다른 열이 선택되면서 여러가지 복잡한 상황이 발생해서요.
마우스 드래그 시에는 selection 이 안되게 처리한다던지 또는 mousedown 시에는 selection 이 발생 안되게 하고 mouseup 시에 해당 위치 열이 selection 되도록 설정할 수 있으면 좋을것 같은데 방법이 있을까요?
혹시 질문에 대해 참고가 되실까 해서 제가 작업했던 onSelectionChanged event 처리기 코드를 공유합니다. 현재는 마우스 드래그로 인한 selection 발생 시 여러가지 문제가 있어 비활성화 한 상태입니다.
onSelectionChanged(val) {
this.bSelectSomething = true;
if (this.bMouseUpAfterSelection == false) return;
if (this.flexGrid != null) {
if (this.flexGrid.selection.col == -1 || this.flexGrid.selection.row == -1) return;
if (this.currentSelection != null && this.currentSelection === this.flexGrid.selectedItems[0]) {
console.log("[MainGrid]onSelectionChange selected twice:", this.currentSelection);
let gapTimestamp = +new Date() - this.lastSelectTimestamp;
if (gapTimestamp > 1500) {
this.currentSelection = null;
this.flexGrid.select(-1, -1);
this.lastSelectTimestamp = +new Date();
}
} else {
this.currentSelection = this.flexGrid.selectedItems[0];
console.log("[MainGrid]onSelectionChange selected new:", this.currentSelection);
console.log("[MainGrid]onSelectionChange select val:", this.flexGrid.selection);
this.flexGrid.select(this.flexGrid.selection.row, -1);
this.lastSelectTimestamp = +new Date(); //Math.floor(+new Date() / 1000);
}
this.$emit("on-main-select", this.currentSelection);
this.bMouseUpAfterSelection = false;
}
},