2015년 7월 21일 화요일

selectize 와 autocomplete 기능

셀렉트 박스에 몇가지의 value를 선택하여 dynamic하게 설정할 때  구현이 가능한지 몰라서 다르게 구현한 적이 많았다.

하지만 selectize라는 오픈 소스를 접한다면 생각을 달라질 것이다.


그림과 같이 여러개의 값을 선택할 수 있고 해당 input박스 영역에서 입력 가능한 input데이타를 출력 할수 있으면 해당 문자열을 입력하는 경우 autocomplete기능을 제공한다.
 - jquery의 autocomplete 기능을 사용하여 구현한 것으로 보여짐






















 - 여러가지 기능이 추가된 UI

그 외 여러가지 추가적인 기능이 가능하니 아래의 해당 홈페이지의 api명세를 참조하기 바란다.

http://brianreavis.github.io/selectize.js/

해당 플러그인이 아닌 몸소구현이 하고 싶다 jquery auto complete기능을 이용하여 구현이 가능할 것으로 보여진다.

위의 그림 과 같이 jquery의 autocomplete와 select multiple values를 이용하면 selectize와 유사한 기능을 구현할 수 있다.

자세한 내용은 jquery ui의 홈페이지를 참조하기 바란다.

https://jqueryui.com/autocomplete


댓글 없음:

댓글 쓰기