0

I have 4 different tabs and each of them is making ajax request each time they are opened. But if I click one of them and its ajax request is not complete, newly opened tab is affected by old ajax request.

  • One of them is opened(lets say first one)

  • Before ajax request is returned, I click the second tab.

  • Second tab makes ajax call

  • The ajax call of first one is complete and it changes html content of first tab, and I open tabs content after ajax call is complete. So even if I am on the second tab, since ajax call of the first one is done late, it opens the first section. How can I prevent that? I want the ajax call of the old tabs dissappear, abort, not effecting etc.

I tried to add condition with boolean but it didnot work for me.

zumuj
  • 62
  • 6
  • Possible duplicate: https://stackoverflow.com/questions/446594/abort-ajax-requests-using-jquery – threeFatCat Oct 30 '19 at 12:27
  • "The ajax call of first one is complete and it does stuff" - on the second tab? It should do stuff on the first tab only. Which browser is this? – Rup Oct 30 '19 at 12:27
  • 1
    Maybe he is talking about tab element `div`s? Without the codes, it's hard to tell – threeFatCat Oct 30 '19 at 12:28
  • Your questions are duplicated. Please see solution answered here https://stackoverflow.com/a/26735236/3740460 – maki10 Oct 30 '19 at 12:28
  • I have updated the question @Rup and it is chrome – zumuj Oct 30 '19 at 12:45
  • OK, thanks. Can you clarify what you mean by tabs? Are they UI tabs on the same page, i.e. you have a tabbed UI that you have built but it's just one page? We'd have to see your code to work out what's going wrong. Are they 'open in new tab' browser tabs? That ought not happen. – Rup Oct 30 '19 at 12:46
  • I also dont want to abort request since it may not be 100% accurate. when I try to abort, if the request is back but running its success function, abort will not work. – zumuj Oct 30 '19 at 12:47
  • @Rup I built them, and they are on the same page. when clicked, page doesnot change. sorry I cannot provide code. I wish I could. – zumuj Oct 30 '19 at 12:49

1 Answers1

0

You could listen for browser.tabs.onActivated event and discard the old XMLHttpRequest Object and create a new one.

It's hard to discuss the details without seeing how you implemented the AJAX call.

https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/tabs/onActivated https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest

anu
  • 1,017
  • 1
  • 19
  • 36