How to correct rewrite the Ajax request to make it work in IE 8 +, using XDomainRequest?
$.ajax({
type: "GET",
url: url,
success: function(xml) {
$('.post-msg').append(processXml(xml, config));
},
error: function(jqXhr, textStatus, errorThrown) {
var errorMsg = "Request on url: " + url + " failed: " + textStatus + " error:" + errorThrown;
alert(errorMsg);
}
});
Use this plugin for IE8-9 Xdomain support.
https://github.com/MoonScript/jQuery-ajaxTransport-XDomainRequest
Related
Good evening,
I'm trying to do a AJAX call in a C# page and I'm dealing with some problems.
My jQuery code is:
$(document).ready(function () {
$.ajax({
type: "POST",
url: "conteudo.aspx/GetNewPost",
data: { ids: "<%=Request.QueryString["idconteudo"]%>" },
contentType: 'application/json; charset=utf-8',
dataType: 'json',
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert("Request: " + XMLHttpRequest.toString() + "\n\nStatus: " + textStatus + "\n\nError: " + errorThrown);
},
success: function (data) {
alert("ok");
}
});
});
And my code-behind is:
[WebMethod]
public static string GetNewPost(string ids)
{
// some code
return ids;
}
Does someone know what is going on?
PS: The error is Internal Server Error.
Please use code as below
Because you are using text data type from query string, you can make datatype as text
$(document)
.ready(function () {
var q = "<%=Request.QueryString["idconteudo"]%>";
alert(q);// just to check the value
// assuming that you had passed query string value
$.ajax({
type: "POST",
url: "conteudo.aspx/GetNewPost",
data: { "ids": q },
//contentType: 'application/json; charset=utf-8',
dataType: 'text',// data type should be text
error: function(XMLHttpRequest, textStatus, errorThrown) {
alert("Request: " +
XMLHttpRequest.toString() +
"\n\nStatus: " +
textStatus +
"\n\nError: " +
errorThrown);
},
success: function(data) {
alert("ok");
}
});
});
Edit 1 : If the Web Method is on ASPX page, you shall use below code, so that you get result in Json format
$(document)
.ready(function () {
var q = "<%=Request.QueryString["idconteudo"]%>";
//alert(q);
// just to check the value
// assuming that you had passed query string value
$.ajax({
type: "POST",
url: "conteudo.aspx/GetNewPost",
data: '{ids: "' + q + '" }',
contentType: 'application/json; charset=utf-8',
dataType: 'json',
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert("Request: " +
XMLHttpRequest.toString() +
"\n\nStatus: " +
textStatus +
"\n\nError: " +
errorThrown);
},
success: function (result) {
alert("ok" + result.d);
}
});
});
try:
var idconteudo = "<%=Request.QueryString["idconteudo"]%>";
...
...
url: "conteudo.aspx/GetNewPost",
data: "{ids: \"" + idconteudo + "\"" }",
contentType: 'application/json; charset=utf-8',
...
...
From what you have given us with your post, I see two things that are incorrect and one other thing that may have just not been posted in your question, but it is in fact in your real source.
1) Your data is written wrong. It should be:
$(document).ready(function () {
var test = "<%=Request.QueryString["idconteudo"]%>";
$.ajax({
type: "POST",
url: "conteudo.aspx/GetNewPost",
data: { 'ids' : test }, // the ids needs to have quotes to be correct syntax
dataType: 'text',
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert("Request: " + XMLHttpRequest.toString() + "\n\nStatus: " + textStatus + "\n\nError: " + errorThrown);
},
success: function (data) {
alert("ok");
}
});
});
2) You say it's a POST but your method isn't decorated with the [HttpPost] Annotation.
3) Your dataType is set to 'json' but your method is returning a string.. so 'json' should be changed to 'text'.
Hope this helps!
The following JSONP JQuery (v1.10.2) call works on all browsers except Safari:-
$.ajax({
cache: false,
type: 'GET',
url: userExistsUrl,
dataType: 'json',
error: function (jqXHR, textStatus, errorThrown) {
var errText = 'We are not able to process your request at the moment (' + textStatus + ', ' + errorThrown + ')';
console.error('HTTP response : ' + jqXHR.status);
console.error(errText);
displayError(errText);
},
success: function (xml) { }
});
On Safari the error function is invoked and the variable textStatus contains the string "error". However if I select the Developer menu option 'Disable cross-origin restrictions' the call works.
As this is just a standard JSONP call, how can I get it to work on Safari without invoking the developer option?
your dataType is wrong
dataType: 'jsonp'
Can someone explain why this function does not work in firefox?
At first I thought it was a problem of form submission. So I reduced the code to the one performed at runtime function. Same problem with firefox: internal 500 server error. Thank you for your time.
<script type="text/javascript">
$(document).ready(function() {
var urls;
urls = "http://server/api/v1/update/discipline";
var data = {"id": "702","disciplinaNome":"John Doe 4"}
$.ajax({
url: urls,
type: "POST",
data: data,
contentType: "application/x-www-form-urlencoded",
success: function(responseData, textStatus, jqXHR) {
alert("data edited")
console.log("Data: " + responseData + "\nStatus: " + textStatus);
//if success close modal and reload ajax table
reload_table();
},
error: function(jqXHR, textStatus, errorThrown) {
console.log("Data Error: " + errorThrown + "\nStatus: " + textStatus);
// alert('Error update data');
}
});
});
</script>
Firefox F5:
CHROME F5
My app is based substantially on CRUD operations. All operation work great on Safari and other browsers, but not in Firefox. I can not understand what could be the problem. I'm new on js because I come from obj-c whose environment provides an excellent debugging. When i post data from a form to server, I get a 500 internal server error.
I looked for information everywhere, but the suggested solutions do not work for my case. Any help is largely appreciated.
My code:
function save() {
var url;
if (save_method == 'add') {
alert('Method Add');
var ids = $('input[name="id"]').val();
var disciplinaNome = $('[name="disciplinaNome"]').val();
console.log(ids + disciplinaNome);
url = "http://SERVER.me/Api/v5/create/discipline";
$.ajax({
url: url,
type: "POST",
data: "disciplinaNome=" + disciplinaNome,
contentType: "application/x-www-form-urlencoded",
success: function(responseData, textStatus, jqXHR) {
$('#modal_form').modal('hide');
alert("data saved")
console.log("Data: " + responseData + "\nStatus: " + textStatus);
//if success close modal and reload ajax table
$('#example').dataTable().fnClearTable();
$('#example').DataTable().ajax.reload();
},
error: function(jqXHR, textStatus, errorThrown) {
alert('Error adding data');
}
});
} else {
url = "http://server/Api/v5/update/discipline";
alert('Method update');
}
$('[name="disciplinaNome"]').val());
var ids = $('input[name="id"]').val();
var disciplinaNome = $('[name="disciplinaNome"]').val();
console.log(ids + disciplinaNome);
var ajaxLock = 1;
// ajax adding data to database
$.ajax({
url: url,
type: "POST",
data: "id=" + ids + "&disciplinaNome=" + disciplinaNome,
contentType: "application/x-www-form-urlencoded",
success: function(responseData, textStatus, jqXHR) {
alert("data edited")
console.log("Data: " + responseData + "\nStatus: " + textStatus);
//if success close modal and reload ajax table
$('#modal_form').modal('hide');
$('#example').dataTable().fnClearTable();
$('#example').DataTable().ajax.reload();
// reload_table();
ajaxLock = 0;
},
error: function(jqXHR, textStatus, errorThrown) {
alert('Error update data');
}
});
}
UPDATE with disciplinaNome
I have the following code and want to use it as an object.
How to i access the properties of the object? currently i am always getting undefined!
function getLoggerInfo()
{
$.ajax({
url: "data.json",
type: "GET",
data: {emGetInfo: "logger"},
dataType: "json",
success: function(response){
//alert("1: " + this.loggerName);
loggerName = response.emGetInfo[0].loggerName;
protocol = response.emGetInfo[0].protocolVersion;
$("#console").text("Logger Name: " + loggerName + " - Protocol Version: " + protocol);
return;
},
error: function(jqXHR, textStatus, errorThrown){
$("#console").text("ERROR: AJAX errors. " + jqXHR + " : " + textStatus + " : " + errorThrown);
return;
},
statusCode: {
404: function() {
$("#console").text("404: The requested JSON file was not found.");
return;
}
}
});
}
// get loggerName...
$(document).ready(function () {
// Get logger info event...
$("#ajax").click(function() {
var loggerInfo = new getLoggerInfo();
alert("Loggername: "+ loggerInfo.loggerName);
});
});
AJAX is asynchronous - so it does not return data ... the following is a (rough) outline of what happens when you use the $.ajax() function
The data is sent to the url
The browser continues - executing other code as required
When the url (called in step 1) finishes being processed the success callback is executed.
Step 3 could be 1 second, 10 seconds, 5 minutes later
you should process the request in the success callback :
$.ajax({
url: "data.json",
type: "GET",
data: {emGetInfo: "logger"},
dataType: "json",
success: function(response){
// process here
loggerName = response.emGetInfo[0].loggerName;
alert(loggerName);
}
});