Form tabs
=========

.. image:: images/tabs.png

Baton provides an easy way to define form tabs in yor change form templates. Everything is done through javascript and you only need to add some classes you your ``ModelAdmin`` fieldsets ::

    from django.contrib import admin
    from .models import Item, Attribute, Feature

    class AttributeInline(admin.StackedInline):
        model = Attribute
        extra = 1

    class FeatureInline(admin.StackedInline):
        model = Feature
        extra = 1

    class ItemAdmin(admin.ModelAdmin):
        list_display = ('label', 'description', 'main_feature', )
        inlines = [AttributeInline, FeatureInline, ]

        fieldsets = (
            ('Main', {
                'fields': ('label', ),
                'classes': ('baton-tabs-init', 'baton-tab-inline-attribute', 'baton-tab-fs-content', 'baton-tab-group-fs-tech--inline-feature', ),
                'description': 'This is a description text'

            }),
            ('Content', {
                'fields': ('text', ),
                'classes': ('tab-fs-content', ),
                'description': 'This is another description text'

            }),
            ('Tech', {
                'fields': ('main_feature', ),
                'classes': ('tab-fs-tech', ),
                'description': 'This is another description text'

            }),
        )

Rules
-----

- Inline classes remain the same, no action needed
- In the first fieldset define a ``baton-tabs-init`` class which enables tabs
- On the first fieldset, you can add an ``order-[NUMBER]`` class, which will be used to determined in which position to place the first fieldset. The order starts from 0, and if omitted, the first fieldset has order 0. If you assign for example the class ``order-2`` to the first fieldset, then the first fieldset will be the third tab, while all other tabs will respect the order of declaration.
- For every ``InLine`` you want to put in a separate tab, add a class ``baton-tab-inline-MODELNAME`` or ``baton-tab-inline-RELATEDNAME`` if you've specified a related_name to the foreign key
- For every fieldset you want to put in a separate tab, add a class ``baton-tab-fs-CUSTOMNAME``, and add a class ``tab-fs-CUSTOMNAME`` on the fieldset
- For every group you want to put in a separate tab, add a class ``baton-tab-group-ITEMS``, where items can be inlines (``inline-RELATEDNAME``) and/or fieldsets (``fs-CUSTOMNAME``) separated by a double hypen ``--``. Also add a class ``tab-fs-CUSTOMNAME`` on the fieldset items.
- Tabs order respects the defined classes order
- Fieldsets without a specified tab will be added to the main tab. If you want the fieldset to instead display outside of any tabs, add a class ``tab-fs-none`` to the fieldset. The fieldset will then always be visible regardless of the current tab.

Other features:

- when some field has an error, the first tab containing errors is opened automatically
- you can open a tab on page load just by adding an hash to the url, i.e. #inline-feature, #fs-content, #group-fs-tech--inline-feature