JSON - Not working in Internet Explorer 8 - javascript

I tried few thing to fix, Nothing helped.
in server side script,
$array['content'] = "test";
echo json_encode($array);
This is working in javascript. But
$array['content'] = "<p>test</p>";
echo json_encode($array);
Not working. If i add any html tag, it is not working.
But they all are working in firefox and chrome.
This is the js handling the return value.
function showResponse(responseText) {
$('.form_result').html(responseText.formData);
alert(responseText.formData);
}
function submitButton1() {
var options = {
beforeSubmit: showRequest, // pre-submit callback
success: showResponse, // post-submit callback
dataType: 'json',
cache: false
};
// bind form using 'ajaxForm'
$('#form').ajaxSubmit(options);
}
header("Cache-Control: no-cache, must-revalidate");
header("Expires: 0");
Added the above two lines in php file.
<meta http-equiv="X-UA-Compatible" content="IE=8" />
Added the above in html file which handling the js. Still no use.
What could be the problem?
additionally, i dont see any error or warning in IE.

Internet Explorer 8 doesn't support CORS in the XMLHttpRequest object which jQuery is using
ie8 uses XDomainRequest object
jQuery doesn't support XDomainRequest by default.
check this An update is available for the native JSON feature in Internet Explorer 8

i don't know what's the problem, but if disable enctype="multipart/form-data" all works fine.
I guess it's ajax form plugin problem.

I haven't tried this, but if you search for XMLHttpRequest object existing, and it doesn't, then implement your own ajax call.
Also check if JSON exists, and if doesn't then include json.js from just download it from the github and dynamically add it.

Related

Issue using jQuery to do a google maps api call (JSON not being returned)

This is the code I was originally using and worked perfectly fine up until yesterday (which is when I noticed it but I am unsure when it actually stopped working for sure). I know this was working at the beginning of last week so sometime between then and yesterday it broke. I am running this code within a RAD called Alpha Anywhere but have tested it outside of this program (in just a HTML page) and it still didn't work. Hoping someone knows if there is a bug or if there is something I can do to fix this issue. I ran this in firefox with firebug on and that is where I saw the error letting me know that the JSON wasn't retrieved.
var $jq = jQuery.noConflict();
$jq.getJSON('http://maps.googleapis.com/maps/api/directions/json?origin=Toronto&destination=Montreal&sensor=false',function(results){
// I have code in here to calculate miles driven per state
// (as in the above code origin and destination would be filled
// with variables but I went with this basic call because even this doesn't work).
});
This following code does not work (as of right now November 11, 2013 at 10:26 PM CDT) when running it in firefox or chrome. With firebug on it shows I am not getting a response from google. However this following code does respond when ran in safari 7.0.x on Mac OSX 10.9.
<!DOCTYPE html>
<html>
<head>
<script src="http://api.jquery.com/jquery-wp-content/themes/jquery/js/jquery-1.9.1.min.js"></script>
<script>
function getData() {
var url = 'http://maps.googleapis.com/maps/api/directions/json?origin=Huntsville,AL&destination=Atalanta,GA&sensor=false';
var $jq = jQuery.noConflict();
$jq.getJSON(url, function (results) {
alert(results.routes[0].legs[0].distance.value);
});
}
</script>
<title>jQuery Debug of Google API</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width">
</head>
<body>
<button onclick="getData();">click</button>
</body>
</html>
There are a couple problems here:
First, from jsonp explained:
As you may be aware you cannot directly load data files from another domain. This is a security issue that has been around for a long time and is commonly solved by sharing data through an API, REST or such. However there are ways around this ... [for example] JSONP
To do this in jQuery:
Using $.ajax, add dataType: 'jsonp', which appends callback=? to the URL
Using $.getJSON (shorthand for .ajax), add callback=? at the end of the requested URL.
That indicates that we want to use JSONP. Remove it and a vanilla JSON request will be used; which will fail due to the same origin policy.
Another issue is that some external APIs (like Google Maps Directions API), don't automatically serve JSONP. If the server doesn't know what to do with the callback parameter then the response from the API will still be JSON, not JSONP. In order to ensure the returned content is formatted correctly, you can go through a proxy server like the jsonp.guffa.com
To use it, change the request to http://jsonp.guffa.com/Proxy.ashx?url=YourEncodedURI
Where you have replaced YourEncodedURI with the encoded requested url string.
Putting it all together:
var mapsUrl = 'http://maps.googleapis.com/maps/api/directions/json' +
'?origin=Toronto&destination=Montreal&sensor=false';
var encodedUrl = encodeURIComponent(mapsUrl);
var proxyUrl = 'http://jsonp.guffa.com/Proxy.ashx?url=' + encodedUrl;
$.ajax({
url: proxyUrl,
dataType: 'jsonp',
cache: false,
success: function (data) {
console.log(data);
}
});
Working Demo in jsFiddle
Further Reading:
What is JSONP all about?

Need to work around selectSingleNode in IE10

My client has a web app that started throwing errors in IE10. I tracked down the source of the error and it seems IE 10 no longer supports selectSingleNode. Here's the function where it's used:
ScormApi.prototype.setTom = function( tom ) {
this.tom = CreateXmlDocument();
var rootelem = importAllNode( this.tom, this.tomTemplate.documentElement, true );
this.tom.appendChild( rootelem );
// Transforms the tracing of the user in tracking template
// Perform the navigation on all nodes of tom and for each value found
// Sets it to this.tom
rootelem = tom.selectSingleNode('//cmi');
this.parseXML( rootelem, '/' , this, this.setTomParam );
}
It's called with the following code:
var ajxreq = new Ajax.Request(
this.baseurl+'?op=Initialize',
{ method: 'post',
asynchronous:false,
postBody: strSoap,
requestHeaders: {
'Man':"POST " + this.baseurl + " HTTP/1.1",
'Host':this.host,
"Content-type":"text/xml; charset=utf-8",
"SOAPAction":this.serviceid + "Initialize",
"X-Signature":playerConfig.auth_request
}
});
if( ajxreq.transport.status == 200 ) {
try {
this.setTom( ajxreq.transport.responseXML );
}
}
I found suggestions to change the response type to msxml-document, use querySelector or use jQuery's find function, but I can't piece together how to actually implement it in this prototype framework. Any assistance would be greatly appreciated.
As for http://doogalbellend.blogspot.fr/2012/04/cross-browser-selectsinglenode-for-xml.html
Update – This no longer works in IE10, since selectSingleNode has been removed from the XML document returned from AJAX calls. This can be worked around by setting the response type of the XmlHttpRequest, like so :
xhr.responseType = 'msxml-document';
Modifying your request by adding responseType: 'msxml-document' in the options should work.
Note, this solution only works if you don't need features from IE 10. But if you have a site that worked fine until IE 10 came along and you just want it to work again, I found this other answer on IE10 javascript access xml element issue
Basically you just put in a meta tag to tell IE 10 to treat your site as if it is IE9 and it works again.
In PHP, if you want to only put the tag in if it's IE10, you can do this:
$isIE10 = (bool) preg_match('/(?i)msie [10]/',$_SERVER['HTTP_USER_AGENT']);
if ($isIE10) echo '<meta http-equiv="X-UA-Compatible" content="IE=9" />';

'JSON' is undefined error in JavaScript in Internet Explorer

We are using jQuery in our application. We have used a jQuery plugin to implement JavaScript session.
It is working properly in Firefox and most Internet Explorer 8 browsers.
But in some Internet Explorer 8 browsers it does not work. It gives the following error.
Message: 'JSON' is undefined
Line: 6
Char: 3
Code: 0
Message: '$.namesession' is null or not an object
Line: 53
Char: 2
Code: 0
`
The version of Internet Explorer in both the cases is same.
But there were some differences in Internet Explorer settings like Use SSL3.0 and Enable Smart Screen filters check boxes in the Advanced tab in the Internet options were unchecked.
When we checked it, it started working. When we unchecked them it was still working.
What is the actual problem in IE8?
Maybe it is not what you are looking for, but I had a similar problem and i solved it including JSON 2 to my application:
https://github.com/douglascrockford/JSON-js
Other browsers natively implements JSON but IE < 8 (also IE 8 compatibility mode) does not, that's why you need to include it.
Here is a related question: JSON on IE6 (IE7)
UPDATE
the JSON parser has been updated so you should use the new one: http://bestiejs.github.io/json3/
<!DOCTYPE html>
Otherwise IE8 is not acting right. Also you should use:
<meta http-equiv="X-UA-Compatible" content="IE=EDGE" />
Please add json2.js in your project . i was faced the same issue i have fixed.
please use the link: https://raw.github.com/douglascrockford/JSON-js/master/json2.js
and create new file json.js, copy the page and past into newly created file , and move that file into your web application.
I hope it will work.
Check for extra commas in your JSON response. If the last element of an array has a comma, this will break in IE
Change the content type to 'application/x-www-form-urlencoded'
I had the very same problem recently. In my case on the top of a php script I had some code generationg obviously some extra output to the browser. Removal of empty lines (between ?> and html-tag ) and simple cleanup helped me out:
<?php
include('../config.php');
//
ob_clean();
?>
<!DOCTYPE html>
I had this error 2 times. Each time it was solved by changing the ajax type. Either GET to POST or POST to GET.
$.ajax({
type:'GET', // or 'POST'
url: "file.cfm?action=get_table&varb=" + varb
});

Access denied to jQuery script on IE

I have an iframe using the jQuery 1.4.2 script. The same iframe is injected into both http and https sites. The jQuery script is included in the main HTML file as a relative path (e.g., /scripts/jquery-1.4.2.min.js).
When an AJAX call is made, Internet Explorer denies access. The AJAX is calling on another subdomain, but it's using the right protocol. All other browsers work but Internet Explorer gives the following error:
SCRIPT5: Access is denied.
jquery-1.4.2.min.js, line 127 character 344
I heard this error is from cross-domain AJAX calls. But why is IE the only one giving me crap? Is there an IE solution?
Also, this is my AJAX:
$.ajax({
url: thisURL,
dataType: "json",
data: {cmd : 'getMessage', uurl: urlVar, t: Math.random()},
success: function(ret){
callback(ret)
}
});
IE requires you to use XDomainRequest instead of XHR for cross site, you can try something like...
if ($.browser.msie && window.XDomainRequest) {
// Use Microsoft XDR
var xdr = new XDomainRequest();
xdr.open("get", url);
xdr.onload = function() {
// XDomainRequest doesn't provide responseXml, so if you need it:
var dom = new ActiveXObject("Microsoft.XMLDOM");
dom.async = false;
dom.loadXML(xdr.responseText);
};
xdr.send();
} else {
// your ajax request here
$$.ajax({
url: thisURL,
dataType: "json",
data: {cmd : 'getMessage', uurl: urlVar, t: Math.random()},
success: function(ret){
callback(ret)
}
});
}
Reference
http://forum.jquery.com/topic/cross-domain-ajax-and-ie
not sure whether it fits your scenario
xdr = new XDomainRequest();
xdr.onload=function()
{
alert(xdr.responseText);
}
xdr.open("GET", thisUrl); //thisURl ->your cross domain request URL
//pass your data here
xdr.send([data]);
you can find some more guidance here
This solved the issue gracefully for me:
https://github.com/MoonScript/jQuery-ajaxTransport-XDomainRequest
Just install/compile after jQuery and before your script and use the $.ajax method as you normally would, the rest is handled behind the automatically.
Have you try to use the lastest of JQuery(> jquery-1.8.0)? Since the version 1.8.0, they solved some IE9's bugs. Perhaps this one too.
http://blog.jquery.com/2012/08/30/jquery-1-8-1-released/
I had a similar problem and the solution for me was to use jsonp instead of json. That way I didn't have to break out a customer version for IE.
You can only do this if the json server host supports the callback request variable or you have access to the server and can add support. Here is a page that helped me understand the process. Its .net mvc focused, but it gives a good over view of the diffrence between json and jsonp.
http://blogorama.nerdworks.in/entry-EnablingJSONPcallsonASPNETMVC.aspx
Check the domain you are accessing, following response headers should be there
"Access-Control-Allow-Methods" : "POST, GET, OPTIONS"
"Access-Control-Allow-Origin" : "http://www.mydomain.com" or "*"
the other domain should allow your script request. One more header to be added to your response is P3P header.
"p3p" : "CP=IDC DSP COR ADM DEVi TAIi PSA PSD IVAi IVDi CONi HIS OUR IND CNT"
it should help you out.
I was facing similar issue.
I was using file upload control but it was hidden and I had another element trying to control the file upload and events to upload file in ajax way
try using the file upload control directly. this solved issue in my application.
I get this bug (and thus google here) but the reason was very different. So if you don't have cross site and still get this access denied error: double check the value sent
let's say that you affect one of you variable with the bad following expression:
urlVar = $("theID").val // without () this was the error!
[...]ajax call:
data: {cmd : 'getMessage', uurl: urlVar, t: Math.random()},
Google/FF have no problem with this (check what is receive server side...) BUT IE refuse to send this!
I changed my JQuery from version 1.10.1 to 1.10.2 and it seems to have solved this problem for me.
It seems that MS is finding its own way of doing things, rather than adopting industry recommendations. I found the solution here:
https://github.com/MoonScript/jQuery-ajaxTransport-XDomainRequest/blob/master/jQuery.XDomainRequest.js
Simply add 'callback=?' on your ajax URL request like here:
http://wsvdmeer.blogspot.com.es/2012/08/bugfix-getjson-not-working-in-ie.html

Jquery ajax() call fails in IE8

I have the following code for submitting data using ajax from forms of class ajax. this works perfectly in Firefox, Safari and Chrome but fails in IE.
ajax: function() {
$('form.ajax').live('submit', function() {
var form_ajax = $(this);
$.ajax({
url: form_ajax.attr('action'),
data: form_ajax.serialize(),
type: form_ajax.attr('method'),
dataType: 'script',
beforeSend: function(xhr) {
$('#ajax-bid-new .ajax-form-error, #ajax-bid-new .ajax-form-success').remove();
form_ajax.slideUp();
}
});
return false;
});
Please help - I am stuck here for past 2 days. I am returning a Javascript file from server to be evaluated inside browser. This works as expected in Firefox, Chrome and Safari, but IE receives it as a file and opens up the file download dialog.
What can I do in IE to make this work? I tried by dropping the following code in my application.js file (I'm doing a rails project btw)
// public/javascripts/application.js
jQuery.ajaxSetup({
'beforeSend': function(xhr) {xhr.setRequestHeader("Accept", "text/javascript")}
})
I get the same behavior from IE even after writing the ajaxSetup block like above.
Looks like live doesn't work with submit in IE. Have you tried using a normal submit instead:
$('form.ajax').submit(function() {
To catch live form submit events in IE, instead of:
$("form").live("submit", function() { ... });
to
var submitHandler = function() { ... };
$("body").children().each(function() {
$("form", this).live("submit", submitHandler);
})
Point to be noted
IE caches AJAX requests really aggressively (more so than Firefox, anyway). You need to set the Cache-Control headers in the response appropriately if this is not right for your site.
change your content type, last time i fixed similar problem by changing content-type from application/json; charset=utf8 to just plain application/json
jQueries' bind and live behaviours along with the liveQuery plugin
LiveQuery plugin solved the problem http://github.com/brandonaaron/livequery

Categories

Resources