0

I've tried to send GET request to a multiple hosts and to render the response status in separated foe each host. The code below it works fine for xhttp request but in case of jsonp data type (to avoid of Access-Control-Allow-Headers errors) I need to use another json type to send the request and can't use the regular function. In the code below it using ajax request and I didn't manage to use the responseHandler function to render the response status. Please your help how to correct this code.

var hosts = ['http://www.bla.com:8082/bla','http://www.bla2.com:8082/bla','http://www.bla3.com:8082/bla', 'http://www.bla4.com:8082/bla']; //Added


var ledTypes = {
    green: "<img id='logo' src='green.png' height='30' width='30'>",
    red: "<img id='logo' src='red.png' height='30' width='30'>",
    yellow: "<img id='logo' src='yellow.png' height='30' width='30'>"
};

var hostIndx = 0;

function collectionChecking() {

    for  (hostIndx < hosts.length; hostIndx++;) {
           $.ajax({
                url: hosts[hostIndx],
                dataType: "jsonp",
                jsonpCallback: "_stdout",
                cache: false,
                crossDomain: true,
                timeout: 10000,
               success: handleLedResponse(data, textStatus, jqXHR, hostIndx) { alert(data); },
               error: handleLedResponse(jqXHR, textStatus, errorThrown, hostIndx) { alert(errorThrown); }
            })
    }
}

function handleLedResponse(textStatus, hostIndx) {
    var curSpan = document.getElementById('col_host_' + hostIndx);
    if (textStatus === 200 || textStatus === 204) {
        curSpan.innerHTML = ledTypes.green;
    } else if (textStatus === 500 || textStatus === 404) {
        curSpan.innerHTML = ledTypes.red;
    } else if (textStatus === 300 || textStatus === 301 || textStatus === 302) {
        curSpan.innerHTML = ledTypes.yellow;
    }

The trigger to run this script:

 <li><a href="#tabs-2" onclick="collectionChecking()">Services status</a></li>

The response are rendered to the index.html as well

Idan E
  • 1,299
  • 4
  • 17
  • 42

1 Answers1

0

Try this code.

for(; hostIndx < hosts.length; hostIndx++) { First issue was in for loop syntax. Your loop didn't work. try console.log(hostIndx) in your loop.

   function collectionChecking() {

    for(; hostIndx < hosts.length; hostIndx++) {

           $.ajax({
                url: hosts[hostIndx],
                dataType: "jsonp",
                jsonpCallback: "_stdout",
                cache: false,
                crossDomain: true,
                timeout: 10000,
                success: function(data, textStatus, jqXHR) { handleLedResponse(textStatus, hostIndx) },
                  error: function(data, textStatus, jqXHR) { handleLedResponse(textStatus, hostIndx); }
            })
    }
}
Jithin Lukose
  • 344
  • 4
  • 18
  • Probably it will work, but It receives a parser errors so maybe that is the reason the status does't render.. Do you have any idea to solve this? – Idan E Jul 01 '17 at 17:35
  • Check this answer https://stackoverflow.com/a/5359239/1640577. This is your issue. right ? – Jithin Lukose Jul 02 '17 at 06:57