Bootstrap Form Helper 나라 선택 입력 폼

디자인/Bootstrap 2013. 8. 19. 13:09

Bootstrap Form Helper 나라 선택 입력 폼

 


TestBootstrapFormHelperCountries.html


나라를 입력할 수 있는 입력 폼 또한 Bootstrap Form Helper 에서 제공하는 것중에 유용한 플러그인입니다.

아래와 같은 화면으로 구성되어 있으며 각 나라 이름 앞에 국기를 아이콘으로 표현한 것도 특징입니다.

 


 


Bootstrap Form Helper 플러그인의 특징처럼 간단한 HTML 코드로 입력 폼을 추가할 수 있습니다.

 

<body>

       <form class="bs-docs-example form-inline">

             <div class="container well">

                    <div class="bfh-selectbox bfh-countries" data-country="US" data-flags="true">

                           <input type="hidden" value=""> <a class="bfh-selectbox-toggle" role="button" data-toggle="bfh-selectbox" href="#"> <span class="bfh-selectbox-option input-medium" data-option=""></span>

                                 <b class="caret"></b>

                           </a>

                           <div class="bfh-selectbox-options">

                                 <input type="text" class="bfh-selectbox-filter">

                                 <div role="listbox">

                                        <ul role="option">

                                        </ul>

                                 </div>

                           </div>

                    </div>

             </div>

       </form>

 

</body>



: