django-tables2 multitablemixin and bootstrap tabs - django-tables2

Question

So I am trying to render two tables in two tabs using same view and template.
I can display it alright but when sorting the table in second tab (if click) it gets redirected to first tab (obviously because of the URL). Can I change the URL code to correspond with the tab code (using JavaScript to get tab URLs)?
Table:
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()
Template:
<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>

Answer 1

You should just need to add show active classes to the tabs depending on which you want to show, so the focus will show up for that tab.
Problem is figuring out which table you are coming from. As near as I can tell there isn't any way to discern if both tables are being ordered. If only one table is ordered you could check the URL parameters that are passed in.
In your TemplateView, add context:
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
In 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">