Edit tables

iommi edit tables build on top of iommi tables but enable editing of cells too.

A simple example:

EditTable(
    auto__model=Album,
    page_size=10,
    # Turn on the edit feature for the year column
    columns__year__field__include=True,
    # Turn on the delete row feature
    columns__delete=EditColumn.delete(),
)

▼ Hide result

Toggle structure

Orderable edit tables

iommi edit tables also support manual ordering. That can be especially useful for editing reverse FKs in nested forms.

The easiest way to make an EditTable orderable is to inherit your model from iommi.models.Orderable:

from iommi.models import Orderable

class FavoriteArtist(Orderable):
    user = ForeignKey(
        settings.AUTH_USER_MODEL,
        on_delete=models.CASCADE,
        related_name='favorite_artists',
    )
    artist = ForeignKey(Artist, on_delete=CASCADE, related_name='+')
    comment = CharField(max_length=255)

    def __str__(self):
        return self.artist.name

class UserForm(Form):
    class Meta:
        auto__model = get_user_model()
        auto__include = ['username', 'email']
        fields__username__editable = False

class FavoriteArtists(EditTable):
    class Meta:
        auto__model = FavoriteArtist
        auto__include = ['artist__name', 'comment', 'sort_order']
        columns__comment__field__include = True
        sortable = False

user = get_user_model().objects.get(username='john.doe')

class ParentForm(Form):
    user_form = UserForm.edit(auto__instance=user)
    favorite_artists = FavoriteArtists(rows=user.favorite_artists.all())

    class Meta:
        actions__submit__post_handler = save_nested_forms

ParentForm()

▼ Hide result

Toggle structure

If you already have a custom model field for ordering, you can register it as a reorder_handle column:

from iommi import register_edit_column_factory

register_edit_column_factory(YourOrderField, shortcut_name='reorder_handle')

If you just use any django integer field, you can still make your EditTable orderable with:

class MyEditTable(EditTable):
    class Meta:
        auto__model = Foo
        columns__bar = EditColumn.reorder_handle()
        sortable = False

We use SortableJS and if you want, you can also pass other options. For example this allows multi-drag:

class MyEditTable(EditTable):
    class Meta:
        auto__model = Foo
        columns__bar = EditColumn.reorder_handle()
        reorderable = {
            "multiDrag": True,  # Enable multi-drag
            "selectedClass": 'selected',  # The class applied to the selected items
            "fallbackTolerance": 3,  # So that we can select items on mobile
        }
        sortable = False

Note: We recommend using sortable=False on orderable EditTables, because it doesn’t really make sense to have both. And if you sort table by another column, the reorder_handle column gets render_column=False.