Animate CC HTML5 canvas in Internet Explorer ajax function not working

[iccolor]

While my project works fine in Firefox and Chrome, but for some strange reason beyond my expertise my images and text being called by the .ajax function do not show up in IE.

Can anyone help?

$.ajax({

     type: 'GET',

     url: 'data/carousel.json',

     dataType: 'json',

     success: function (json) {

     carouselItems = json;

     consol.log(carouselItems);

     renderImages();

},

error: function() {

consol.log("error");

}

});

[Joseph Labrecque]

Looks like jQuery - and jQuery has a number of different ways of doing AJAX calls... some of which may not work in older browsers:

https://api.jquery.com/jQuery.ajax/

I'd also check to be sure the browser console is not outputting and warnings or errors.

[iccolor]

Hi Joseph,

Thank you for responding.

Ill check out the link you provided.

[iccolor]

I corrected all errors but 1 and the data is still not populating.

Error: TypeError: Cannot read property (the textContent is what the error is referring to).

Note:  I am working your Data-Driven Animation video - rss feed.

root.feedTitle.text = title[0].textContent;

[JoãoCésar · Accepted solution]

Hi.

Use an XMLHttpRequest instead.

https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest

Example:

this.loadJSON = function(url, callBack)
{
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = function()
    {
          if (this.readyState == 4 && this.status == 200)
              callBack(this.responseText);
    };
    xmlhttp.open("GET", url, true);
    xmlhttp.send();
};
this.loadJSON("data/carousel.json", function(response)
{
    alert(response);
});

Regards,

JC

[shannonterry]

Hello JC,

I need some similar help here but with a post to a PHP script sending two variables.  Right now I had AJAX but it its not working either.  I put this in the last frame of my HTML5 app to run.

var viewed = 'yes';
var version = 'two';

$.ajax({
	url: '/dbscript.php',
        dataType: 'json',
	type: 'post',
	data: {viewed: viewed, version: version},
	success: function (responce){
	        //do something
	}
})

Any help here would greatly be appreciated!

[JoãoCésar]

Hi.

I'm not a jQuery user but I saw here that IE is not supported since version 2.

And it may not be your case, but this PreloadJS page has some useful information regarding compatibility. I may give you some idea.

Sorry for not being able to help you better.

Regards,

JC

[JoãoCésar]

BTW, have you tried using XMLHTTPRequest instead?

[shannonterry]

Hey JC,

So sorry, I apollogize for the confusion. I notice icolor was using ajax in thier Animate file and you gave him XMLHTTPRequest to use instead.  I am also trying to use AJAX to make a PHP database call from Animated but can't get it to work and was wondering if you could help me using XMLHTTPRequest instead. I am trying to pass two variables to the PHP file though as a POST, which is where some of my confusion lies.

Thanks again for your help on this.

Shannon

[JoãoCésar]

Sure.

Here it is:

var viewed = "yes";
var version = "two";
var http = new XMLHttpRequest();
var url = "./dbscript.php";
var params = "viewed=" + viewed + "&version=" + version;

http.open("POST", url, true);
http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

http.onreadystatechange = function ()
{
	if (http.readyState == 4 && http.status == 200)
		alert(http.responseText);
}

http.send(params);

Just remember that you need a PHP enabled server (I tested using MAMP on Mac and XAMPP on Windows). The one that Animate creates when we run the Test command won't work.

I hope it helps.

Regards,

JC

[shannonterry]

Thank you JC that worked just great!  Appreciate you.

Shannon

[JoãoCésar]

Awesome, Shannon! You're welcome!