> For the complete documentation index, see [llms.txt](https://docs.pages.revox.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.pages.revox.io/form-elements/selectbox.md). # Selectbox ## **Default select** Default select depends on [classie.js](https://github.com/desandro/classie). Make sure it's included inside the `` before core template script inclusions. ```markup ``` Add `.cs-select` and `.cs-skin-slide` to any ` ``` ## **Advance Select** Pages uses [Select2](https://select2.org/) jQuery plugin for advance selects with search facility. Follow these steps to initialize the plugin **Step one** Include the stylesheet `select2.css` inside the `` if it's not there already. ```markup ``` **Step two** Include the required javascript files inside the `` before core template script inclusions, if they are not there already. ```markup ``` **Step three** Append data attribute `data-init-plugin="select2"` to initialize any `
``` **Step four** Apply the plugin to your desired element {% hint style="info" %} Make sure you place the following script **below** all the pre-requisites mentioned in the Step two above. {% endhint %} ![](/files/-LE9z9xk9hjkJQM4yXSO) ```markup ``` {% hint style="warning" %} jQuery validation and select2 is not directly compatible. Use the following code to fix it {% endhint %} ```javascript $("#SELECTBOX_ID").change(function(){ $(this).trigger("blur"); }); ```