django-tables2 multitablemixin 和引导选项卡答案

【问题标题】：django-tables2 multitablemixin and bootstrap tabsdjango-tables2 multitablemixin 和引导选项卡
【发布时间】：2020-11-23 17:44:31
【问题描述】：

所以我尝试使用相同的视图和模板在两个选项卡中呈现两个表。我可以正常显示它，但是在第二个选项卡中对表格进行排序时（如果单击），它会被重定向到第一个选项卡（显然是因为 URL）。我可以更改 URL 代码以与选项卡代码对应（使用 JavaScript 获取选项卡 URL）吗？表：

class TaskTableView(MultiTableMixin, TemplateView):
template_name = 'task_table.html'

def get_tables(self):
    qs = Task.objects.all()
    self.tables = [
        TaskTable(qs.filter(assigned_to=self.request.user.userprofile), prefix='1-'),
        TaskTable(qs.filter(created_by=self.request.user.userprofile), prefix='2-0'),
        ]
    return super().get_tables()

模板：

<div class="tab-content" id="myTabContent">
{% for table in tables %}
{% if forloop.first %}
<div class="tab-pane fade show active" id="home" role="tabpanel" aria-labelledby="home-tab">
    {% render_table table %}
</div>
{% elif forloop.last %}
<div class="tab-pane fade" id="profile" role="tabpanel" aria-labelledby="profile-tab">
    {% render_table table %}
</div>
    {% endif %}
    {% endfor %}
<div class="tab-pane fade" id="contact" role="tabpanel" aria-labelledby="contact-tab">...</div>

【问题讨论】：

标签： django-tables2

【解决方案1】：

您应该只需要根据要显示的选项将show active 类添加到选项卡，这样焦点就会显示在该选项卡上。

问题在于弄清楚您来自哪个表。据我所知，没有任何方法可以辨别是否正在订购两个表。如果只订购一张表，您可以检查传入的 URL 参数。

在您的 TemplateView 中，添加上下文：

def get_context_data(self, *args, **kwargs):
    context = super(TaskTableView. self).get_context_data(*args, **kwargs)

    for key in request.GET.keys():
        if key.startswith('2-0'):  # 2-0 being the prefix for the second table
            context['show_table_1'] = False 
            context['show_table_2'] = True
            # you'll want to get out of the loop if you find this one
            continue
        else:
            # default show table 1
            context['show_table_1'] = True
            context['show_table_2'] = False

    return context

在task_table.html中：

<div class="tab-pane fade {% if show_table_1 %}show active{% endif %}" id="home" role="tabpanel" aria-labelledby="home-tab">

...

<div class="tab-pane fade {% if show_table_2 %}show active{% endif %}" id="home" role="tabpanel" aria-labelledby="home-tab">

【讨论】：