django admin - A better, user-friendly ArrayField widget

The problem

The current ArrayField input in Django admin displays a single input box. You're supposed to use a comma to separate the values. This is anything except user-friendly.

And this fails for two more reasons:

  • If a value has a comma, then Django will interpret that value as two values
  • Nested ArrayFields are not supported

Custom widget

I've created a Django app called django-jsonform which dynamically generates form inputs for ArrayField. This app was originally created for dynamic json forms, but it also supports ArrayField.

It looks like this:

Django admin better ArrayField using django-jsonform


First, install django-jsonform:

$ pip install django-jsonform

Second, add django_jsonform to your INSTALLED_APPS:


    # ...

Now, we'll need to use the ArrayField provided by django-jsonform which is just a subclass of Django's default ArrayField. The only difference is that it will use the dynamic widget instead of a plain input field.

This is what you'll do in your file:


from django_jsonform.models.fields import ArrayField

class ShoppingList(models.Model):
    items = ArrayField(
        models.CharField(max_length=10, blank=True),

Register your model in the admin site and you should see a dynamic, user-friendly widget as shown in the image earlier.