Add form field for tags and PostgreSQL ARRAY field support

flask_admin/contrib/sqlamodel/form.py

@@ -240,6 +240,9 @@ class AdminModelConverter(ModelConverterBase):
         field_args['validators'].append(validators.UUID())
         return fields.TextField(**field_args)
 
+    @converts('sqlalchemy.dialects.postgresql.base.ARRAY')
+    def conv_ARRAY(self, field_args, **extra):
+        return form.Select2TagsField(save_as_list=True, **field_args)
 
 # Get list of fields and generate form
 def get_form(model, converter,

flask_admin/form.py

@@ -152,3 +152,37 @@ class RenderTemplateWidget(object):
 
         template = jinja_env.get_template(self.template)
         return template.render(kwargs)
+
+
+class Select2TagsWidget(widgets.TextInput):
+    """`Select2 <http://ivaynberg.github.com/select2/#tags>`_ styled text widget.
+    You must include select2.js, form.js and select2 stylesheet for it to work.
+    """
+    def __call__(self, field, **kwargs):
+        kwargs['data-role'] = u'select2tags'
+        return super(Select2TagsWidget, self).__call__(field, **kwargs)
+
+ 
+class Select2TagsField(fields.TextField):
+    """`Select2 <http://ivaynberg.github.com/select2/#tags>`_ styled text field.
+    You must include select2.js, form.js and select2 stylesheet for it to work.
+    """
+    widget = Select2TagsWidget()
+    def __init__(self, label=None, validators=None, save_as_list=False, **kwargs):
+        """Initialization
+
+        :param save_as_list:
+            If `True` then populate ``obj`` using list else string
+        """
+        self.save_as_list = save_as_list
+        super(Select2TagsField, self).__init__(label, validators, **kwargs)
+
+    def process_formdata(self, valuelist):
+        if self.save_as_list:
+            self.data = [v.strip() for v in valuelist[0].split(',') if v.strip()]
+        else:
+            self.data = valuelist[0]
+
+    def _value(self):
+        return u', '.join(self.data) if isinstance(self.data, list) else self.data
+

flask_admin/static/js/form.js

@@ -8,6 +8,9 @@
             case 'select2blank':
                 $(el).select2({allowClear: true, width: 'resolve'});
                 break;
+            case 'select2tags':
+                $(el).select2({tags: [], tokenSeparators: [','], width: 'resolve'});
+                break;
             case 'datepicker':
                 $(el).datepicker();
                 break;
@@ -51,6 +54,7 @@
       this.applyGlobalStyles = function(parent) {
         $('[data-role=select2]', parent).select2({width: 'resolve'});
         $('[data-role=select2blank]', parent).select2({allowClear: true, width: 'resolve'});
+        $('[data-role=select2tags]', parent).select2({tags: [], tokenSeparators: [','], width: 'resolve'});
         $('[data-role=datepicker]', parent).datepicker();
         $('[data-role=datetimepicker]', parent).datepicker({displayTime: true});
       };