I have a ASP.NET MVC 4 application. This application will be embedded into another site (different domain) via an iFrame.
Part of the application has functionality to get a list of cities based off state. I'm using jQuery Ajax to do this. All browsers are working except IE.
Based off my googling, I've learned that I need to use XDomainRequest for IE. So here's the code:
/* For dynamically getting list of cities by state */
$("#state").change(function() {
$(".city").empty();
if ($(this).val() != "") {
if ($.browser.msie && window.XDomainRequest) {
var data = "state=" + $(this).val();
var xdr = new window.XDomainRequest();
xdr.open("POST", "/Search/GetCities");
xdr.send(data);
xdr.onload = function() {
var json = $.parseJSON(xdr.responseText);
if (json == null || typeof(json) == 'undefined') {
json = $.parseJSON(data.firstChild.textContent);
}
processData(json);
};
xdr.send();
} else {
$.ajax({
type: "POST",
url: "/Search/GetCities",
data: {
state: $(this).val()
},
dataType: "json",
success: function(data) {
if (data == '') {
$("#state").change();
} else {
$(".city").css("display", "none");
var items = "<option value=\"\" selected>Please Select</option>";
$.each(data, function(i, item) {
items += "<option value='" + item.Value + "'>" + item.Text + "</option>";
});
$(".city").append(items);
$(".city").css("display", "");
$(".city").attr('disabled', false);
}
}
});
}
}
});
/* End dynamically getting list of cities by state */
Here's the kicker. With FF, Chrome and Safari, the authentication cookie gets passed in the Ajax call but not in IE so IE thinks I'm not an authentication user so it responses with the login URL.
What am I missing to make this work with IE?
Thanks!