I have several <select>'s on a page of which i'd like to populate using Ajax.
Problem Statement: Some ajaxcalls can take up to two minutes to execute. The result, causes the rest of the calls (which only take one second) to execute "after" the previous ajax calls.
On the network table, BSCS is fetched, then EPCOMON is fetched "after". Along down the line, each request is made only after the previous one has finished. I've done tests and validated that BSCS indeed does return around 2 minutes, and SAP, for example, returns in 1 second.
How can I get these requests to be made truly asynchronously?
I started out with a simple jQuery $.get call:
for select2 in $("select.select2-package[name^='component_bundle']")
product = select2.getAttribute('data-product')
$.get "/bundles/fetch_components.json?product=#{product}", (resp) ->
$(product).val(resp)
And eventually moved on to see if i could force async (in case something was overriding the default jQuery async true value)
$.ajax
url: "/bundles/fetch_components.json?product=#{product}"
dataType: 'application/json'
cache: true
ifModified: false
async: true
success: (resp) ->
console.log(resp.responseText)
$("#component_bundle_#{product}").val(resp.responseText)
error: (resp) ->
console.log(resp)
portal.showErrorDialog("ERROR", resp.responseText)
Both attempts yield the same result. each ajax call is executed one after the other. How can I make these requests work truly asynchronously?
