Feature/select multiple

CHANGELOG.md

@@ -5,6 +5,7 @@
 ### Adds
 
 * Add group widget which is a fieldset container for other form widgets.
+* Add multiple and size fields to select widget.
 
 ### Fixes
 

i18n/en.json

@@ -84,8 +84,10 @@
   "recaptchaValidationError": "There was a problem validating your reCAPTCHA verification submission.",
   "requiredError": "This field is required",
   "select": "Select input",
+  "selectAllowMultiple": "Allow multiple options to be selected",
   "selectBlank": "",
   "selectChoice": "Select input options",
+  "selectSize": "Number of options in the list that should be visible",
   "submitLabel": "Submit button label",
   "templateOptional": "(Optional)",
   "text": "Text input",

modules/@apostrophecms/form-select-field-widget/index.js

@@ -26,6 +26,20 @@ module.exports = {
             }
           }
         }
+      },
+      allowMultiple: {
+        label: 'aposForm:selectAllowMultiple',
+        type: 'boolean',
+        def: false
+      },
+      size: {
+        label: 'aposForm:selectSize',
+        type: 'integer',
+        def: 0,
+        min: 0,
+        if: {
+          allowMultiple: true
+        }
       }
     }
   },
@@ -38,5 +52,21 @@ module.exports = {
         output[widget.fieldName] = self.apos.launder.select(input[widget.fieldName], choices);
       }
     };
+  },
+  extendMethods (self) {
+    return {
+      async output(_super, req, widget, options, _with) {
+        return _super(
+          req,
+          {
+            ...widget,
+            allowMultiple: widget.allowMultiple ?? false,
+            size: widget.size ?? 0
+          },
+          options,
+          _with
+        );
+      }
+    };
   }
 };

modules/@apostrophecms/form-select-field-widget/views/widget.html

@@ -17,6 +17,7 @@
   <select
     class="apos-form-input {{ prependIfPrefix('__input') }}" id="{{ id }}"
     name="{{ widget.fieldName}}" {% if widget.required %}required{% endif %}
+    {% if widget.allowMultiple %}multiple {% if widget.size %}size="{{ widget.size }}"{% endif %}{% endif %}
   >
     <option value="">{{ __t("aposForm:selectBlank") }}</option>
     {% for choice in widget.choices %}