add "searchable" as an alias for dropdown in the form component

thanks @c-classen

sqlpage#297

Author: lovasoa

examples/official-site/sqlpage/migrations/01_documentation.sql

@@ -225,7 +225,8 @@ INSERT INTO parameter(component, name, description, type, top_level, optional) S
     ('max', 'The minimum value to accept for an input of type number', 'NUMBER', FALSE, TRUE),
     ('checked', 'Used only for checkboxes and radio buttons. Indicates whether the checkbox should appear as already checked.', 'BOOL', FALSE, TRUE),
     ('multiple', 'Used only for select elements. Indicates that multiple elements can be selected simultaneously. When using multiple, you should add square brackets after the variable name: ''my_variable[]'' as name', 'BOOL', FALSE, TRUE),
-    ('dropdown', 'For select and multiple-select elements, displays them with a nice dropdown that allows searching for options.', 'BOOL', FALSE, TRUE),
+    ('searchable', 'For select and multiple-select elements, displays them with a nice dropdown that allows searching for options.', 'BOOL', FALSE, TRUE),
+    ('dropdown', 'An alias for "searchable".', 'BOOL', FALSE, TRUE),
     ('create_new', 'In a multiselect with a dropdown, this option allows the user to enter new values, that are not in the list of options.', 'BOOL', FALSE, TRUE),
     ('step', 'The increment of values in an input of type number. Set to 1 to allow only integers.', 'NUMBER', FALSE, TRUE),
     ('description', 'A helper text to display near the input field.', 'TEXT', FALSE, TRUE),
@@ -300,7 +301,7 @@ SELECT
 FROM fruits
 ```
 ', json('[{"component":"form", "action":"examples/show_variables.sql"},
-    {"name": "Fruit", "type": "select", "dropdown": true, "value": 1, "options":
+    {"name": "Fruit", "type": "select", "searchable": true, "value": 1, "options":
         "[{\"label\": \"Orange\", \"value\": 0}, {\"label\": \"Apple\", \"value\": 1}, {\"label\": \"Banana\", \"value\": 3}]"}
     ]')),
     ('form', '### Multi-select
@@ -338,7 +339,7 @@ left join my_user_options
     and my_user_options.user_id = $user_id
 ```
 ', json('[{"component":"form", "action":"examples/show_variables.sql"}, 
-    {"label": "Fruits", "name": "fruits[]", "type": "select", "multiple": true, "create_new":true, "placeholder": "Good fruits...", "dropdown": true, "description": "press ctrl to select multiple values", "options":
+    {"label": "Fruits", "name": "fruits[]", "type": "select", "multiple": true, "create_new":true, "placeholder": "Good fruits...", "searchable": true, "description": "press ctrl to select multiple values", "options":
         "[{\"label\": \"Orange\", \"value\": 0, \"selected\": true}, {\"label\": \"Apple\", \"value\": 1}, {\"label\": \"Banana\", \"value\": 3, \"selected\": true}]"}
     ]')),
     ('form', 'This example illustrates the use of the `radio` type.

sqlpage/templates/form.handlebars

@@ -63,7 +63,7 @@
                         {{~#if required}} required="required" {{/if~}}
                         {{~#if autofocus}} autofocus {{/if~}}
                         {{~#if multiple}} multiple {{/if~}}
-                        {{~#if dropdown}} 
+                        {{~#if (or dropdown searchable)}} 
                             data-pre-init="select-dropdown"
                             data-sqlpage-js="/{{static_path 'tomselect.js'}}"
                         {{/if~}}