Develop Reference

How to handle multiple requests being sent in JavaScript?

Working on a platform, to enable auto-ticketing functionality. For which a REST API request is used for ticket creation. Unfortunately, there are 2 requests popping simultaneously, which results in creating duplicated tickets.
How to handle such case and send only one of these requests?
Tried adding the 2nd request in the response callback of the first, though this does not seem to work.
if (flag == 1){
logger.debug("Node-down alarm-Request raised - +sitn_id);
clearTimeout(mouseoverTimer);
mouseoverTimer = setTimeout(function(){
logger.debug("Inside Call back function - ");
//function call for ticket creation
incidentRequest(sitn_id,confUtil.config.mule_url);
}, 10);

You really should show more of the code that makes the request, though it seems as if you are doing some ajax inside your 'incidentRequest', so I will presume that (if that isn't what you are doing, then please, show your code....) - and since you tags say javascript and jquery - well, here goes...
To stop the 'double send' in an AJAX call, it is simple:
function incidentRequest(sitn_id,confUtil.config.mule_url){
// stop the double by clearing the cache
$.ajaxSetup({cache: false});
// continue on with the AJAX call
// presuming the url you want is confUtil.config.mule_url
// and the data you want to send is sitn_id
$.post(confUtil.config.mule_url, 'sitn_id=' + sitn_id, function (data) {
// do cool stuff
});
}
Hopefully that will help you get moving. If not, then we will need more code of what is going on around all this.

jQuery ajax code inside "success" function only works if placed first

I'm experiencing some extremely weird behavior with Ajax. Or maybe it's normal. I wouldn't know. I'm quite new to playing around with Ajax.
My problem is that I am making a few Ajax calls(two using $.post() and one using the standard $ajax() call), and they seem to return the data fine, but the code inside the success function only works in a very peculiar way.
I have noticed that some things work if placed first in line to be executed; but why is that? It really doesn't make any sense to me. In this case I would like the span with the id link_span to be updated dynamically, as my Ajax calls link and unlink devices from each other.
(the correct_classes function counts how many links have been linked and adds it to the link_counter variable that I've made global with the window object).
But as the span only wants to update if the corresponding code is placed on top, it's kinda useless.
Another problem is also that .ajaxComplete() and other such event handlers don't always get called. For example, I attempted to show and hide a loader gif by using .ajaxComplete() to close it when ajax stop. But this only works with one of my calls which is the standard $.ajax call.
I'm really confused.
Any help would be great, and please ask me to clarify if there's something I haven't made clear enough.
Here is a small snippet of what I'm talking about:
$.post( "<?php echo base_url(); ?>connections/ajax_link", datax).done(function( resp,status ) {
$("#loader_overlay").css('display','none');
display_confirmbox();
resp=JSON.parse(resp);
var str = resp['parent_selector'];
var arr = mystr.toString().split("||");
correct_classes(arr[1], resp);
$( '#link_span' ).text( '( ' + window.link_counter + ' ) links found' ); //this doesnt work unless its on top
});
Update
It seems that the problem is caused by correct_classes();
the array from the ajax call gets passed to the function in which jQuery complains about something, and causes the rest of the ajax code to halt. Yet everything inside correct_classes() gets executed. The error in question is this:
TypeError: invalid 'in' operand e
specifically what is causing the problem seems to be this(i commented everything else out and this is:
$.each( val, function( i, value ) {
var mystr = value;
}
I really cant figure out why it complains about this code when it seems to work.

i'm not sure to have understand your problem.... but if you use 3 async ajax call ($.post or $.ajax is indifferent $.post is a contract syntax to call $.ajax({type:"post"})) you need to wait the full loading of all calls for use their response.
so.. if one of your call evalue window.link_counter you need to wait his response before call the code you have post.
For wait the complete load you may nast the call inside the success function of the prev call.
for you knowlage there is an attribute of $.post() dataType if you set it to "json" you not need to parse the response because Jquery do it for you, this code is useless:
resp=JSON.parse(resp);
and, the method .done() is calling whether the call is successful if it fails, $.post() has a success function callback. Use it, it's better, and use .fail() to catch call error.
See documentation about $.post(): here
however... the element who have this id #link_span is generated by one of ajax call?

Delay Execution Of Script Jquery (or SetTimeOut) BUT when out of scope

I've read some answers on this problem, but I'm not sure what to do in my case.
I have a function where the idea is it will keep attempting to connect via AJAX, and if it fails it will keep trying again every 5 seconds to submit information. This is important for a web app I'm developing where the users are offline 50% of the time and online 50% of the time.
The issue is in my current setup, I want to call setTimeOut to delay the execution of the function, but I think because I'm inside another function it has no idea about the location of startAjaxSubmitLoop() function? But when I run my code and check in console, I see millions of connections to my server one after another without a delay. It's as if the setTimeout() function delay properties was not working at all but it was still running the function?
Any ideas what I'm doing wrong?
function startAjaxSubmitLoop(id,tech_id){
//TODO: Make POST instead of GET because of pictures.
var request = $.ajax({
url: "script.php",
type: "GET",
data: { }
});
//If Successfully Sent & Got Response.
request.done(function( msg ) {
//Sometimes because of weak connections response may send, but the message it worked might not come back.
//Keep sending until for sure SUCCESS message from server comes back.
//TODO: Make sure server edits existing entries incase of double sends. This is good in case they decide to edit anyways.
$( "#log" ).html( msg );
});
//If Failed...
request.fail(function( jqXHR, textStatus ) {
//Color the window the errorColor
//alert( "Request failed: " + textStatus );
setTimeout(startAjaxSubmitLoop(id,tech_id),5000);
console.log('test');
});
}

You're calling setTimeout incorrectly. You're calling your startAjaxSubmitLoop immediately on the setTimout line and passing the result to setTimeout instead of your function. Modern setTimeout implementations (es5) let you pass args to setTimeout as below:
Instead of:
setTimeout(startAjaxSubmitLoop(id,tech_id),5000);
Use:
setTimeout(startAjaxSubmitLoop, 5000, id, tech_id); //call startAjaxSubmitLoop in 5000ms with id and tech_id
The standard way of doing this to support older browsers where setTimeout doesnt take params is to just wrap your function startAjaxSubmitLoop
setTimeout(function(){startAjaxSubmitLoop(id, tech_id)}, 5000); //equivalent to above

two ways to do this:
1) with a callback function:
setTimeout( function(){startAjaxSubmitLoop(id,tech_id);},5000);
2) with parameters listed after the function name (no parentheses) and timeout period:
setTimeout(startAjaxSubmitLoop,5000, id, tech_id);

AJAX calls fail in Opera and IE8

For some reason, AJAX requests seem to be failing in both Opera 11.51 and IE8 but work in Firefox and Chrome. I am not doing anything fancy other than the standard post request call:
$.post('/dashboard/valid_email/', { email:email }, function(data) {
I've added an alert before and after the AJAX call and I only get one alert which means the callback function isn't called.
I am using jquery.1.6.2 hosted on Google.
Any ideas?

Add an error handler to see what error is being thrown. If you are returning something other than text/html, you need to set the dataType parameter to the proper dataType.
Parse error means that there is something wrong with the data you are returning; if you are returning html, then the html is not valid, and if you are returning json, the json is not well-formed.
$.post(url,data,callback,datatype).fail(function(x,y,z){
alert(x + "\n" + y + "\n" + z);
})

I finally found out what the problem was. I was making use of mouseflow and it was causing problems for some reason on those two browsers! I just removed it and won't be using mouseflow again. I've let the developers know - maybe they can apply a fix.

One error I see: You need to change email to 'email':
$.post('/dashboard/valid_email/', { 'email' : email }, function(data) {
It's not likely your whole problem, but it needs correction.

Help on getting data to output when a variable changes

I am trying to write a JavaScript interface for an Api, but I can not figure out this issue. I have code to call an ajax request:
mooshark.request('userInfoFromID', {
userID : '20991'
});
That code creates an Ajax request. When it starts, it sets an internal variable to true (to indicate that it is running). Then on the next line I have this:
var data = mooshark.response();
alert(data);
The response function is as follows:
response: function () {
if(this.running == false){
return "done";
} else if (this.running == true){
alert("Running");
setTimeout(this.response, 3000);
}
}
It outputs (in this order) Running. undefined. (JSON response). Running. Not once does it output "done". Is there a way to return "done" when this.running becomes true? I would like to mention that this.running will not always be the same request time. I know there is always the option of wrapping all my code inside the onCompleat function in the ajax request, but I want to have that as a last resort.
Thanks!

This is not possible without freezing the browser.
Whenever your code is running, the browser UI will be completely frozen.
If you want the call to wait for the server to reply, the browser will need to be competely frozen. (which is not a good idea)

Since most of the time you're calling response() through setTimeout(), a return value isn't really useful.
But -- you're likely never setting your 'running' variable to false. You might post more code here (the AJAX response handling code, for example). Also: what exactly are you trying to accomplish by returning / alerting "running" and "done"?