컬럼 활용

validator 컬럼 옵션

QCELL은 input, textarea, number, 타입의 컬럼에 대해 **유효성 검사(Validator)**를 설정할 수 있는 기능을 제공합니다.
Validator는 사용자가 값을 입력했을 때, 해당 값의 유효성을 검사하여 적절한 처리를 수행합니다.

Validator의 동작 방식

1. 유효성 검사

▪️사용자가 값을 입력하거나 수정하면, 지정된 validator 콜백 함수가 실행됩니다.
▪️Validator는 입력값이 유효한지 검사한 뒤, true 또는 false를 반환합니다.

2. 검사 결과에 따른 처리

▪️true 반환: 값이 유효한 경우, 입력값이 화면에 반영되며 관련 이벤트(valuechanged 등)가 정상적으로 실행됩니다.
▪️false 반환: 값이 유효하지 않은 경우, 입력값이 반영되지 않고 입력이 취소됩니다.

사용 예시:

Validator로 값의 차이를 제한
수를 입력할 때, 이전 값과 새 값의 차이가 5를 초과하지 않도록 제한하는 Validator를 설정할 수 있습니다.

JS 

{title: ['기업', '숫자 조건(값의 차이가 5이상 또는 5이하면 X)'], type: "number", options: {validator: numbercolumn}},

function numbercolumn(nRow, nCol, value){
	var gap = 0;
	console.log(nRow + ' ' + nCol + ' ' + value);
	gap = Math.abs(qcell.getCellData(nRow, nCol) - value);
	
	if (gap >= 5) {
		alert('5이상 차이날 수 없습니다.');
		return false;
	} else
		return true;
		
}

결과:

값의 차이가 5 미만인 경우: 입력값이 정상적으로 반영됩니다.
값의 차이가 5 이상인 경우: "변경된 값이 이전 값과 5 이상 차이날 수 없습니다."라는 경고 메시지가 표시되고 입력값이 반영되지 않습니다.

리턴값이 true이면 valuechanged 이벤트를 비롯하여 정상적인 흐름으로 동작하고 false인 경우 반영하지 않고 종료합니다.

아래 예제에서 숫자 조건(값의 차이가 5이상 또는 5이하면 X) 외에 최대 글자 수 제한(10)과 금지된 단어 조건("금지어") 컬럼에 대해서도 입력해 보시길 바랍니다.

---