ExtJS 사용시 툴바 또는 버튼에 링크점선 없애기.

흐음 아직은 국내에서 ExtJS를 쓰는 곳은 많이 없는지 덕분에 머 하나 막히면 ExtJS 포럼을 열씸 뒤지는 중이다.

그래도 예전에 비해 ExtJS에 관련된 블로그들이 많이 눈에 띄는 것을 보면 언젠가 ExtJS의 한글서적도 나오지 않을까?

dojo 관련한 책도 영문서적만 있는 걸 보면 큰 기대는 못하고 있지만...-_-

mvc 프레임워크로 스트럿츠2를 사용하기 때문에 요즈음 dojo와  extjs, jQuery 통합을 시도해보고는 있는데

기냥 하나만 쓸까? 고민..

 

여하튼 ExtJS 사용자들을 위한 팁하나 소개할까 한다.

ExtJS로 툴바 또는 버튼을 만들면 a 태그를 사용할 때 처럼 onFocus 상태에서 점선박스가 생기게 된다.

매번 해당 컴포넌트를 만들면서 onFocus ='this.blur()' 를 해주기는 어려운 노릇..

 

ext-all.js 파일을 열어보자

 

<em unselectable=\"on\"><button class=\"x-btn-text\" type=\"{1}\" >{0}</button></em>

 

라는 구문을 찾아서 다음과 같이 수정한다.

 

<em unselectable=\"on\"><button class=\"x-btn-text\" type=\"{1}\" onfocus=\"this.blur()\">{0}</button></em>

 

 이젠 별다른 조치없이도 점선박스는 사라진다. ㅋㅋ

 

PS. 찾아보면 두군데 수정을 하게 된다.

혹여나 이글을  보고 수정했는데 여전히 점선이 나온다는 사람이 있을지 몰라서 언급..*^^*