Reload a specific tab after call ajax

Question

I would like reloading my page after a call Ajax. It works with location.reload() but i'm redirect to the first tab. How can i just reload my tab ?

HTML

<div class="tabs">
  <a class="tab" data-target="#profile">
    <h3 class="tab-title active" data-target="#profile">Mes informations</h3>
  </a>
  <a class="tab" data-target="#prayers">
    <h3 class="tab-title" data-target="#prayers">Mes prières</h3>
  </a>
  <a class="tab" data-target="#pains" id="tab-pains">
   <% if (@notification && @notification.count > 0) %>
     <h3 class="tab-title" data-target="#pains">Mes demandes <span id="tab-notification">(<%= @notification.count %>)</span></h3>
   <% else %>
     <h3 class="tab-title" data-target="#pains">Mes demandes </h3>
   <% end %>
 </a>
</div>

JQuery

$(document).ready(function() {
 $(".user-show-delete").on("click", function(e){
  var id = $(this).data("id");
  var pain_id = $(this).data("id-pain");
  console.log(id)
  console.log(pain_id)
  var current_index = $("#tabs").tabs("option","active");
  swal ({
    title: 'Effacer',
    text: 'Voulez-vous supprimer cette prière ?',
    type: 'question',
    showCancelButton: true,
    confirmButtonColor: '#B56969',
    cancelButtonColor: '#B4D8C0',
    confirmButtonText: 'Oui',
    cancelButtonText: 'Non'
  }).then(function() {
    $.ajax({
      type: 'DELETE',
      url: '/pains/' + pain_id + '/prayers/' + id,
      success: location.reload(),
    });
  });
 });
});

Thanks for your answers

Answer 1

What you are looking for is open specific tab on page reload.

In short, you should add the hash of the tab to the URL. Then when the page loads you open the correct tab using JavaScript.