[해피CGI][cgimall] Easy Tags Selector Plugin - jQuery Tagselect

셀렉트박스 태그를 이용해서
간단하게 태그 셀렉터를 만들수 있는 예제입니다.

 

첨부된 파일을 다운로드 받아서
압축을 풀어보면
tagselect.html 이라는 파일을 웹브라우저로 열어서 보면 확인이 가능합니다.

 

 

 

위 와 같은 태그 선택상자를 제작하려는 분들께 유용할 것 같네요.


HTML파일의 소스코드를 보면

 

 

위와 같은 기본 select 태그와 option태그를 만들어주고,

 

 

 

비교적 간단한 Jquery 스크립트를 실행하는 걸로
첫번째 그림과 같이 태그를 선택할수 있는 부분과,
이미 선택된 태그를 표시해주고,
선택된 태그를 x 표시를 눌러서 삭제하는 것 까지 가능해지네요.

셀렉트박스가 있는 페이지에서
크게 손을 안대고도
위 그림과 같은 태그셀렉트를 화면에 표시할수 있다는 것이 장점일 듯 합니다.


출처는
https://www.jqueryscript.net/form/tags-selector-tagselect.html 입니다.

위 페이지를 통해서,
tagselect 를 생성할때 어떤 옵션들을 이용할 수 있는지 확인을 할수가 있습니다.

 

 

최대 몇개까지 선택하는게 가능한지와,
그 개수 이상을 선택하려고 할때 화면에 뜨는 알림문구 를 조절할수 있으며,
아무런 옵션도 선택을 안했을때 표시되는 문구 정도를 조절하는게 가능해보이네요.