1. Standard Select
A basic replacement for the native select element.
<select id="sf1" class="fw-select">
<option value="" disabled selected>Select a department...</option>
...
</select>
2. Searchable Select
For long lists, enable search with data-searchable="true". This is ideal for selecting from a large dataset like countries.
<select id="sf2" data-searchable="true">
<option value="">Select a country...</option>
<option value="AF">Afghanistan</option>
<option value="AL">Albania</option>
...
</select>
<script>
// Auto-initialized via data-searchable attribute
FormWidgets.autoInit();
</script>