Dojo [펌] 10. Dojo 위젯 상세

황제낙엽 2009.03.11 07:17 조회 수 : 345 추천:151

http://blog.naver.com/rediblue?Redirect=Log&logNo=120036980565

1. Button

1) 스크립트를 통한 생성

// widget 의 createWidget 함수를 이용하여 버튼을 생성하고 버튼의 이름 과 같은 설정을 한다..

var btn = dojo.widget.createWidget("Button",{disabled: false, caption: "test", onClick: test});

// 버튼이 들어갈 div를 정의한다.

var div = document.getElementById("edit_div");

 

2) HTML를 통한 생성

// from의 submit 기능을 갖춘 버튼을 정의한다.

// 일반적인 button의 이벤트를 추가하듯이 onclick 이벤트를 추가할 수 있다

// 또한 버튼이 상태에 따른 이미지 변화 또한 가능하다.

 

 

2. Editor

// 위젯을 생성하고 아이드를 부여한다.

//위젯의 아이디를 통하여 에디터의 입력된 값을 가져온다.

dojo.widget.byId("editor2").getEditorContent()

 

 

3. Pop-Up 매뉴

 

// 이벤트 발생시 팝업 메뉴를 로드한다.

 

// div에 마우스 오른쪽 클릭을 할경우 팝업

4.콤보 box

// 선택상자로 리스트를 검색하거나, 택스트에 입력하였을때 맞는 값을 선택해 준다.

// dataUrl의 형식은 json 형식이다.

 

5.위젯 커스터 마이즈

 

버튼의 색상을 변경하거나, 이미지를 변경하는 것과 같은 위젯의 커스터 마이즈는 CSS 파일을 변경함으로 써

가능하다.

1) 똑같은 클래스를 정의하고 원하는 부분만 오버라이드 한다.

2) CSS 파일의 클래스를 수정한다.

3) templateCssPath를 변경하여 새로 정의한 CSS를 사용한다.


이 게시물을
목록
쓰기 태그