We Keep Coding

Ajax not working intermittently on some computers

I guess I'm not up-to-date or am missing something really simple.
I have the javascript code below, which uses ajax to connect to an external php file which reads the form post'd variables and pulls pricing from a sql database and returns the price, which is updated on the current page. The machine I am testing on uses Windows 7 and the latest version of Chrome browser. The ajax call ALWAYS works. I was in a different office yesterday and tested the code on a Windows 10 machine running the latest Chrome browser and the ajax call seems to never work and no price is updated. I also tried the latest Internet explorer browser on the same Windows 10 machine and it did NOT work. I found another Windows 7 machine at the same location using Chrome and it worked fine on it. What's even crazier is this morning, I tried the code on a Windows 10 machine running the latest Chrome and the first time the page loaded it worked but then quit again.
I keep checking the code and don't see anything, as it works fine on some machines. Any ideas or thoughts would greatly be appreciated.
I am using jQuery v1.12.4. I thought maybe this might have an issue so I tried using 3.1.1 even and nothing changed.
What am I missing? How would I be able to debug the ajax call to see what is actually happening on the computer that it isn't working?
THE JAVASCRIPT CODE:
<script type='text/javascript'>
// Monitor changes to Quantity form field
$('#Quantity').on('keyup', function(event) {
$.ajax({
url: 'updatePrice.php',
type: 'POST',
contentType: 'application/json; charset=utf-8',
data: $('#OrderDetails').serialize(),
datatype: 'json',
success: function(response) {
$("#showPrice").text('$' + response);
}
});
});
function updatePrice() {
$.ajax({
url: 'updatePrice.php',
type: 'POST',
contentType: 'application/json; charset=utf-8',
data: $('#OrderDetails').serialize(),
datatype: 'json',
success: function(response) {
$("#showPrice").text('$' + response);
}
});
}
</script>
THE SHORTENED HTML CODE RELATED TO THE JAVASCRIPT:
Quantity<br><input type="text" name="Quantity" id="Quantity" class="textWidth2" value="">
<img src="images/B&WSelected.png" id="BWimage" onclick="changeImage3(); updatePrice();">
<div class="border-top-color quote_panel">
<span class="quote_title">Your Price:</span>
<span id="showPrice" class="quote_price">$0.00</span>
</div>

I finally figured out what was causing the problem I believe. I think it is both 'crossdomain requests' related and encoding issues.
I edited the ajax call by removing the full url (http://www....) from url: and only left the file name and I removed the line
contentType: 'application/json; charset=utf-8',
from the code and now everything seems to work perfectly
function updatePrice() {
$.ajax({
url: 'updatePrice.php',
type: 'POST',
data: $('#OrderDetails').serialize(),
datatype: 'json',
success:function(response){
$("#showPrice").text('$'+response);
}
});
}

download jQuery CDN – latest stable version

Ajax request seems to fail in IE 8

The following jQuery code returns an xml file from the Met Office datapoint and should alert the user with an attribute in the xml data:-
$.ajax({
url: "http://datapoint.metoffice.gov.uk/public/data/val/wxfcs/all/xml/324246?res=daily&key=myapikey",
dataType: "xml",
method: "GET",
success: function (text) {
myValue = $(text).find("Period Rep").first().attr("W");
alert(myValue);
},
error: function () {
alert("Not working");
}
})
This works fine in Chrome and does what I expect, but in IE8 the error function is called. Any ideas what I'm doing wrong or why IE doesn't want to work?
(Note: I know IE8 is far from ideal but I have to support it for this application unfortunately. There's no way around this at present)

Try
jQuery.support.cors = true;
Before request and
crossDomain: true
as ajax option

Getting XML from official site from JQUERY code

I'm trying to get currencies rate from the URL:
CURRENCY
It works perfect from browser and also from Android java using REST API.
Now I'm trying to get it from JS using JQUERY AJAX.
I use this code:
function handleJson(data)
{
console.log(data);
}
$.ajax({
url: 'http://www.boi.org.il/currency.xml?curr=01?jsoncallback=handleJson',
contentType: 'text/xml',
success: function(result) {
alert("XML File is loaded!");
alert(result);
},
async: true,
dataType:"jsonp",
type:"get"
});
I see in the log that content arrives but I can't handle it.
Here the screenshot

window.open with target '_blank' opens a new browser window

I am trying to open an link in new browser tab (not in new window).
When I place an link on page like
Click Here
when user click on link it will open google in new browser tab. That's fine
BUT
$.ajax({
type: "POST",
url: someURL,
data: {somedata},
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
window.open('http://www.google.com', '_blank'); // it's always open in new browser window and I want a new tab
},
failure: function (response) {
alert(response);
return;
}
});
When I try this within an AJAX web method, it always opens it in new browser window; but I want to open it in new tab as it's working for above example.
I understand this is browser specific functionality but somehow I need to accomplish this.

try this
onclick="window.open('http://www.google.com', '_self');

well it is browser specific, i tested it on mozilla and is working fine, but on chrome it open in new browser window. You can suggest to chrome makers or call ajax synchronus.
use async:false will work.
NOTE: In IE, open new browser window is default behaviour. user need to set settings explicitly

You have to play a little trick here.
You have to create a hidden a link tag with target='_blank' and set the href of this link tag on ajax success and then trigger the click of this link tag for eg.
HTML code
hidden
Js code
$.ajax({
type: "POST",
url: someURL,
data: {somedata},
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
var hiddenLink = $("hidden_link");
hiddenLink.attr("href",response.href);
hiddenLink[0].click();
},
failure: function (response) {
alert(response);
return;
}
});
Here is the working fiddle for above code

JQuery AJAX call, IE9 issues with JSON

JSFiddle: http://jsfiddle.net/D2s2M/1/
I cannot figure out why this does not work in IE9. I've seen other questions here on Stack with similar issues, none of which have solutions that seem fix my problem.
This issue is specific to IE9, it does work in FF and Chrome. However, I am seeing some oddities in Chrome that do not make sense: if I append the contentType:'application/json' inside of the attributes, it breaks functionality inside of Chrome.
Here is the code that is in fiddle:
$('document').ready(function(){
$.ajax({
dataType: 'json',
type:'GET',
url: 'https://freegeoip.net/json/?callback=',
//contentType: 'application/json',
success: function(response, status, xhr){
var ct = xhr.getResponseHeader("content-type") || "";
$('#text').text(ct);
},
error: function(a,b,c) {
$('#text').text('Error: '+' '+b+' '+c);
},
timeout: 3000
});
});
Thanks

Change
dataType: 'json',
to
dataType: 'jsonp',

Solution: http://jsfiddle.net/D2s2M/2/
I'm not precisely sure why this cross-domain issue was IE specific nevertheless, JSONP did lead to resolving the issue.
The service I'm using does support JSONP, in the url there is a querystring variable to specify the name of the callback you wish to use. (JSONP requires that the data either be wrapped in a callback inside of the file itself, or set and passed an object inside of the JSON file.. this is required because JSONP loads everything in the head of the DOM to bypass cross-domain restrictions).
Revised Code:
$('document').ready(function(){
$.ajax({
dataType: 'jsonp',
type:'GET',
url: 'https://freegeoip.net/json/?callback=func',
contentType: 'application/json',
async: false,
jsonpCallback: 'func',
success: function(data){
console.log(data);
},
error: function(a,b,c) {
$('#text').text('Error: '+' '+b+' '+c);
},
timeout: 3000
});
});