WebSquare (2) 요소 및 Property

Palette를 통해 요소들을 드래그&드롭 할 수 있고

 

이 요소들에 각각 Property를 줘서 여러가지 CSS, JS와 비슷한 효과를 줄 수 있다.

 

[ InputBox ] Property

---------------------------------------------------------------------------

1. placeholder - 기존의 placeholder와 비슷한 효과를 준다

 

2. initValue - 박스에 기본값을 부여한다.

 

3. displayFormat - 박스의 값에 형식을 부여한다.

예시)dateType이 number일 경우 #,###.#0 으로 적용하면 3자리수 마다 ,가 찍히며 소수점 2자리까지 표현된다.

※ 이 기능은 박스에 focus가 없는 경우에만 적용되며 박스 클릭 시 포맷이 다시 돌아온다.

focus에 관계없이 적용하려면 : applyFormat 속성값을 all 로 준다.

 

4. id , class - id 과 class 를 부여한다.

id를 등록하면 해당 요소가 스크립트에서 전역변수로 선언된다.

( doucment.getElementById 와 같은 효과 )

예시) id.setValue( 값 ) = 값이 부여되는 스크립트

※ initValue 와 setValue를 같이 쓰면 setValue 값이 최종으로 적용된다.

---------------------------------------------------------------------------

[ Spinner ] => 버튼을 이용해 필드 값 증감 표현

---------------------------------------------------------------------------

[ Secret ] => input type = "password"와 유사한 인터페이스

---------------------------------------------------------------------------

[ SearchBox ] => InputBox와 유사하지만 x아이콘이 제공되 클릭 시 입력값 지움

---------------------------------------------------------------------------

[ InputCalendar ] => Calendar 컴포넌트 + Input 컴포넌트 복합

---------------------------------------------------------------------------

[ TextBox ] => 긴 문장에 사용

---------------------------------------------------------------------------

[ Span ] =>짧은 글자나 변경되는 값에 사용

---------------------------------------------------------------------------

[ Image] =>이미지 표현

---------------------------------------------------------------------------

[ Checkbox] =>체크박스

---------------------------------------------------------------------------

[ MultiSelect ] => Ctrl 키로 여러 항목 선택 가능

---------------------------------------------------------------------------

[ SelectBox] => select tag 기능

---------------------------------------------------------------------------