Add ability to navaigate to specific tab in target view.

tom_observations/templates/tom_observations/partials/observation_list.html

@@ -1,9 +1,10 @@
 <table class="table table-striped">
-  <thead><tr><th>Facility</th><th>Created</th><th>Status</th><th>Scheduled</th><th>Saved  data</th><th>View</th></tr></thead>
+  <thead><tr><th>Facility</th><th>Observation ID</th><th>Created</th><th>Status</th><th>Scheduled</th><th>Saved  data</th><th>View</th></tr></thead>
   <tbody>
   {% for observation in observations %}
     <tr>
       <td>{{ observation.facility }}</td>
+      <td>{{ observation.observation_id }}</td>
       <td>{{ observation.created }}</td>
       <td>{{ observation.status }}</td>
       <td>{{ observation.scheduled_start }}</td>

tom_observations/views.py

@@ -462,9 +462,9 @@ def form_valid(self, form):
             )
             observation_id = form.cleaned_data['observation_id']
             messages.success(self.request, f'Successfully associated observation record {observation_id}')
-        return redirect(reverse(
-            'tom_targets:detail', kwargs={'pk': form.cleaned_data['target_id']})
-        )
+        base_url = reverse('tom_targets:detail', kwargs={'pk': form.cleaned_data['target_id']})
+        query_params = urlencode({'tab': 'observations'})
+        return redirect(f'{base_url}?{query_params}')
 
 
 class ObservationRecordDetailView(DetailView):

tom_targets/templates/tom_targets/target_detail.html

@@ -7,18 +7,24 @@
 {% endblock %}
 {% block content %}
 <script>
-// This script maintains the selected tab upon reload
-$(document).ready(function(){
-  // This is required due to the apparent redefinition of $ in another library: https://api.jquery.com/jquery.noconflict/
-  // Based on trial and error, the offending script appears to be JS9, which is used in dataproduct_list_for_target
-  $.noConflict();
-  $('a[data-toggle="tab"]').on('shown.bs.tab', function(e) {
-    localStorage.setItem('activeTab', $(e.target).attr('href'));
-  });
+document.addEventListener("DOMContentLoaded", function() {
+  // Fetch the URL and look for the 'tab' query parameter.
+  const url = new URL(window.location.href);
+  const tabQuery = url.searchParams.get('tab');
 
-  var activeTab = localStorage.getItem('activeTab');
-  if(activeTab){
-    $('#tabs a[href="' + activeTab + '"]').tab('show');
+  // If a tab is specified in the URL, make it active.
+  if (tabQuery) {
+    const activeTab = '#' + tabQuery;
+    // Remove the 'tab' query parameter to avoid unwanted persistence across
+    // page reloads.
+    url.searchParams.delete('tab');
+    history.replaceState({}, document.title, url.toString());
+
+    // Show the active tab, if any.
+    const tabElement = document.querySelector(`a[href="${activeTab}"]`);
+    if (tabElement) {
+      tabElement.click();
+    }
   }
 });
 </script>
@@ -39,7 +45,7 @@
       {% if object.type == 'SIDEREAL' %}
       {% aladin object %}
       {% endif %}
-      
+
     </div>
   </div>
   <div class="col-md-8">

tom_targets/views.py

@@ -435,7 +435,7 @@ def get(self, request, *args, **kwargs):
                               'Did you know updating observation statuses can be automated? Learn how in'
                               '<a href=https://tom-toolkit.readthedocs.io/en/stable/customization/automation.html>'
                               ' the docs.</a>'))
-            return redirect(reverse('tom_targets:detail', args=(target_id,)))
+            return redirect(reverse('tom_targets:detail', args=(target_id,)) + '?tab=observations')
 
         obs_template_form = ApplyObservationTemplateForm(request.GET)
         if obs_template_form.is_valid():