I am implementing Turbolink in my shopify application.

I have a list of records, when I delete records one after another then first record deleted successfully but when I want to delete another record then the turbolink is redirecting to a URL(previously deleted record) that is not exist.

Example: There are 5 records in the table and the Ids of the records are 1,2,3,4,5.

Step 1: I have deleted record whose id is 1.
Step 2: Now I want to delete another record, Let’s suppose id 3. Here Turbolink is trying to delete the record that is previously deleted (id = 1).

Button HTML:

<a href="<?= url( 'deleteblockip/' . $item->id );?>" onclick="return (confirm('<?= __('Are you sure? You want to delete this IP!') ?>')) ? true : false ;"><i class="fa fa-trash-o"></i></a>

I have also tried to delete records using form:

<form action="<?= url( 'deleteblockip/' . $item->id ); ?>" method="get">
    <input type="hidden" value="<?= $item->id ?>" name="id">
    <button type="submit" class="onclick"><i class="fa fa-trash-o"></i></button>
</form>

Following Code is used to add header with the request

function retrieveToken(app) {

    window['app-bridge-utils'].getSessionToken(app).then(token => {
      window.sessionToken = token;
    });
  }

document.addEventListener("turbolinks:request-start", function(event) {

    Turbolinks.clearCache();

    retrieveToken(app);

    console.log("turbolinks:request-start");
   
    var xhr = event.data.xhr;

    xhr.setRequestHeader("X-Shopify-Authorization", "Bearer " + window.sessionToken);
  });

I’m trying to find why it is redirecting to previously deleted record.