I have several ajax calls in my application and all of them work. However one of the calls doesn't seem to respond.
function GetList() {
$.ajax({
url: serviceURL + 'GetList',
type: 'POST',
dataType: 'json',
contentType: 'application/json; charset=utf-8',
success: function (data: Store[]) { GetListSuccess(data); },
error: function (error: JQueryXHR) {
OnError(error);
}
});
}
GetList is an stored procedure that I have in my Database. When I execute it through the application I get the following error.
XMLHttpRequest: Network Error 0x2eff, Could not complete the operation
due to error 00002eff
I checked the web console and noticed that for this particular call my Type is 'Plain' instead of 'Json'.
Related
I am sending username and password as request parameter to the server in AJAX and trying to show the response message. But not able to showing the response message.In fiddler it is showing the response message. But while on the browser screen it is not showing.PLEASE somebody help me out where i am wrong or need to change anything..
I have written like this-
$(document).ready(function () {
$("#btnCity").click(function () {
$.ajax({
type: "POST",
url: "http://test.xyz.com/login",
crossDomain: true,
contentType: "application/json; charset=utf-8",
data: { username: "abc", password: "1234" },
dataType: "JSONP",
jsonpCallback: 'jsonCallback',
async: false,
success: function (resdata) {
alert(resdata);
},
error: function (result, status, err) {
alert(result.responseText);
alert(status.responseText);
alert(err.Message);
}
});
});
});
TL;DR: I guess the problem is on the server side of your code (that we don't know yet).
At first: I don't know why it fails for you. I've taken your code and ran it against a public available JSONP API, that returns the current IP of your system and it worked.
Please try yourself using the URL: http://ip.jsontest.com/.
So most probably, the server doesn't return the right response to the JSONP request. Have a look at the network tab in developer tools. With your current code, the answer of the server should be something like:
jsonCallback({'someResponseKeys': 'someResponseValue'});
Note: The header should contain Content-Type:application/javascript!
BTW, even if this doesn't for now solve your problem - here are some tweaks, I'd like to advice to you:
Don't set async to false, at the documentation of jQuery.ajax() says:
Cross-domain requests and dataType: "jsonp" requests do not support synchronous
operation.
You don't need to set a jsonpCallback, because jQuery will generate and handle (using the success function a random one for you. Quote from the docs:
This value will be used instead of the random name automatically generated by jQuery. It is preferable to let jQuery generate a unique name as it'll make it easier to manage the requests and provide callbacks and error handling.
So here comes my code:
$(document).ready(function () {
$("#btnCity").click(function () {
$.ajax({
type: "POST",
url: "http://ip.jsontest.com/",
crossDomain: true,
data: { username: "abc", password: "1234" },
dataType: "JSONP",
success: function (resdata) {
console.log("success", resdata);
},
error: function (result, status, err) {
console.log("error", result.responseText);
console.log("error", status.responseText);
console.log("error", err.Message);
}
});
});
});
A working example can be found here.
Another solution, like Yonatan Ayalon suggested, can be done with a predefined function and then setting the jsonpCallback explicitly to the function that should be called.
if you see the response in Fiddler, it seems that the issue is in the callback function.
you are doing a jsonP call - which means that you need a callback function to "read" the response data.
Do you have a local function that calls "jsonCallback"?
this is a simple jsonP request, which initiates the function "gotBack()" with the response data:
function gotBack(data) {
console.log(data);
}
$.ajax({
url: 'http://test.xyz.com/login' + '?callback=?',
type: "POST",
data: formData,
dataType: "jsonp",
jsonpCallback: "gotBack"
});
You can try with the following methods and close every instance of chrome browser in task manager, then open browser in web security disable mode by the command "chrome.exe --disable-web-security"
success: function (resdata) {
alert(resdata);
alert(JSON.stringify(resdata));
},
And the better option to debug the code using "debugger;"
success: function (resdata) {
debugger;
alert(resdata);
alert(JSON.stringify(resdata));
},
cross domain request issue
my ajax call code actually when i am running given url directly in browser it shows me json data but using ajax call it always shows me ajax error believe me i tried n follow many things no fruitful result from 18 days.
$.ajax({
crossDomain:true,
type: "GET",
url: 'http://taxihub.azurewebsites.net/Mobile/api/json.php?method=getCompanyList',
contentType: "application/json; charset=utf-8",
dataType: "json",
processData: false,
success: function (data) {
console.log(data);
return;
},
error: function (err) {
console.log("AJAX ERROR");
console.log(err.responseText);
}
});
you can also check this link directly u will see json data coming but i found error i dont know why
"http://taxihub.azurewebsites.net/Mobile/api/json.php?method=getCompanyList"
error: OPTIONS http://taxihub.azurewebsites.net/Mobile/api/json.php?method=getCompanyList Origin lhost:809 is not allowed by Access-Control-Allow-Origin.
please help me i am stuck here from 18 days on this issue
Remove the cross-domain and content-type part and it'll work but you'll have to do a little extra string manipulation work to put it in JSON object:
$.ajax({
type: "GET",
url: 'http://taxihub.azurewebsites.net/Mobile/api/json.php?method=getCompanyList',
dataType: "json",
success: function (data) {
console.log(data.result.getCompanyList[0].CompanyID);
return;
},
error: function (err) {
console.log("AJAX ERROR");
console.log(err);
}
});
}
Actually it seems cross-domain doesn't have any effect with or without it. I guess the server you're targeting doesn't have strict cross-domain prevention but doesn't like the JSON content-type. I'd be glad to get a more specific explanation.
EDIT I used JQuery 1.10.2 if it matters
This Ajax code works perfectly is I'm running the program on my local machine. However, once we put this out on a DEV server we get a 404 error. The site is an ASP MVC3 site that communicates with a SQL database, and the rest of the site has no problem doing so. I'm brand new to Ajax so I'm not quite sure where to look. Could this be an issue with IIS as well?
Ajax code
var request = $.ajax({
type: 'POST',
url: '/BatchPrograms/PopDetails',
data: { 'programName': pgmname },
dataType: 'text',
success: function (data) {
console.log(data);
alert(data);
//$('#data').dialog('open');
},
error: function (data) {
console.log(data)
alert("Unable to process your resquest at this time.");
}
});
Chrome's Console error message:
POST http://insideapps.dev.symetra.com/BatchPrograms/PopDetails 404 (Not Found)
send jquery-1.8.3.js:8434
jQuery.extend.ajax jquery-1.8.3.js:7986
GetProgramDetails BatchDashboard:51
onclick BatchDashboard:165
Chome's Network error message
Name (Path) Method Status (Text) Type Initiator Size Time (Latency)
PopDetails POST 404 Not Found Text/Html jquery-1.8.3.js:8434 1.8KB 21ms
/BatchPrograms Script 1.6KB 17ms
Try modifying url to
url: '#Url.Action("PopDetails", "BatchPrograms")'
Try using the Url.Action() helper to get the route from the Table Routes defined in your application.
var request = $.ajax({
type: 'POST',
url: '#Url.Action("PopDetails", "BatchPrograms")',
data: { 'programName': pgmname },
dataType: 'text',
success: function (data) {
$('#data').dialog('open');
},
error: function (data) {
alert("Unable to process your resquest at this time.");
}
});
This question already has an answer here:
Calling Web Api POST always receives null value from jQuery
(1 answer)
Closed 3 years ago.
I have a web api with the following POST Method
public HttpResponseMessage Post([FromBody]string package)
I have a console app that uses the HttpCLient with no problems. When I try to make a call by means of jQuery, I get null on the package variable.
This is the code I have right now:
$.ajax({
url: 'http://localhost:8081/api/Package/',
type: 'POST',
data: JSON.stringify(message),
contentType: "application/json;charset=utf-8",
success: function (data) {
alert(data.length);
},
error: function (xhr, ajaxOptions, thrownError) {
alert('Status: '+xhr.status+', Error Thrown: '+thrownError);
}
});
The "message" variable is a complex model containing two properties.
What could I be doing wrong?
I'll appreciate your help...
There might be an issue with binding the value to the response sent to the server
try sending the data as
$.ajax({
url: 'http://localhost:8081/api/Package/',
type: 'POST',
data: { package : JSON.stringify(message) }
datatype: 'json',
success: function (data) {
alert(data.length);
},
error: function (xhr, ajaxOptions, thrownError) {
alert('Status: '+xhr.status+', Error Thrown: '+thrownError);
}
});
I am assuming that your JSON.stringify(message) returns a string value
updated
public HttpResponseMessage Post([ModelBinder]string package)
allowing package to bind from everywhere instead of just body did it for me.
I get a 400 Bad Request error when I try to call WCF service from client side using ajax. Following is my code,
[OperationContract]
[WebInvoke(Method = "POST",
BodyStyle = WebMessageBodyStyle.Wrapped,
ResponseFormat = WebMessageFormat.Json)]
string[] GetUser(string Id);
$.ajax({
type: "POST", //GET or POST or PUT or DELETE verb
url: "http://localhost:58055/Service1.svc/GetUser",
crossDomain: true,
data: '{"Id": "3"}',
contentType: "application/json; charset=utf-8",
dataType: "json", //Expected data format from server
processdata: true, //True or False
success: function (msg) {//On Successfull service call
alert(msg.GetUserResult[0]);
console.log("success " + msg);
},
error: function (msg) {//On Successfull service call
console.log(msg);
}
});
Any insights would be really helpfull...
The first thing you should try is hit the URL using fiddler(so that you could post your data too) and see if you get the same error.
Are you making a cross domain request. From the example it looks like you are not. Could you remove
crossDomain: true,
line and try the jquery again.
There are other options also which unnecessay like processdata. Suggest you to use the following code and see if it works or not.
$.ajax({
type: "POST",
// the url to the service -
url: "url",
// the format that the data should be in when
// it is returned
contentType: "json",
data: '{"Id": "3"}',
// the function that executes when the server
// responds to this ajax request successfully
success: function(data) {
// put the JSON response in the employees table
}
According to the ajax api documentation the default content type is 'application/x-www-form-urlencoded'. When sending JSON, the content type should be 'application/json; charset=utf-8' except that WCF does not like that. I got the same error messages and when I removed the content type I stopped getting this error. By the way, I noticed that you set crossDomain to true, this other question is relevant to that option.