Skip to content

Inline tabs require page refresh to open on change-form (JS race-condition) #642

@Njeru58

Description

@Njeru58

Describe the bug

Inline tabs on the change-form do not open on the first click; the pane only becomes visible after a full page refresh or “Save and continue editing”.

Steps to reproduce

  1. Install django-jazzmin ≥ 2.6.2.
  2. Set changeform_format to "vertical_tabs" (or "horizontal_tabs").
  3. Open the change-form for any model with inlines.
  4. Click any tab other than the first.
  5. Observe: nothing happens until you refresh or re-submit.

Expected behavior

The corresponding inline pane should open immediately on the first click.

Root cause

Bootstrap tab initialisation runs before all inline markup has been injected by Django, so the click handler is never attached.

Suggested fix

Add a deferred Bootstrap tab initialisation in change_form.html:

document.addEventListener('DOMContentLoaded', () => {
  if (window.jQuery && window.jQuery.fn.tab) {
    $('a[data-toggle="pill"], a[data-bs-toggle="pill"]').tab('show');
  }
});

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions