jQuery AJAX request on local development environment fail - javascript

I'm trying to test a jQuery/Javascript script on my local development environment. For some reason the script calls the error delegate. I've attempted to make sure I'm not performing a cross-domain request.
$.ajax({
url: 'http://localhost',
success: function(data, textStatus, jqXHR) {
console.log('success');
console.log(data);
},
error: function(jqXHR, textStatus, errorThrown) {
console.log(textStatus);
console.log(errorThrown);
console.log(jqXHR);
}
});
return marker;
}
I'm running a WAMP stack. Here is my output:
error
undefined
XMLHttpRequest { mozResponseArrayBuffer=ArrayBuffer, status=0, more...}
Does anyone know what could be the issue?

Try replacing the absolute url:
url: 'http://localhost'
with a relative one:
url: '/'
If this doesn't solve your problem FireBug and/or Fiddler will give you more hints about what is going on and why the AJAX request fails.

Related

Load page trought AJAX, get file from location.hash

When i try to do this:
$.ajax ({
url: location.hash,
method: 'GET',
dataType: 'html',
success: function (data, textStatus, jqXHR) {
$('#content').html(data);
},
error: function (jqXHR, textStatus, errorThrown) {
console.log(textStatus);
}
});
I get this error:
Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check http://xhr.spec.whatwg.org/.
My url is: localhost/index.php#test.php
It should use test.php as url to load.
What i need is when there is a hash in the url, i need to load the hash (filename)..
Edit:
When i add:
async: false,
I still get the same error..
Edit:
I am using jQuery version 2.1.3

JQuery Ajax Error on Internet Explorer

I'm making an Ajax Request, it's working in all browser, but in Internet Explorer It's not working. I need that works for internet explorer 9 +
That's the request:
function loadYoutubeVideos(youtubeUrl){
var url = 'youtubeUrl';
$.ajax({
type: 'GET',
dataType: "json",
url: url,
success: function (responseData, textStatus, jqXHR) {
objYoutubeVideos = responseData;
//more functions, blablabla
},
error: function (responseData, textStatus, errorThrown) {
console.log(textStatus, errorThrown);
//error functions
}
});
}
I'm making the some code for load a Facebook Page Content. What do I do?
Have you tried to using jsonp format?
The json format has a issue when use over cross-domain (different domain).
So, you need to use jsonp instead of json, jsonp using javascript callback for solve the cross-domain issue.
more: http://www.sitepoint.com/jsonp-examples/
You don't need create pipe for api request.
Youtube support jsonp format using &callback= parameter.

MS CRM 2013 adds version number to WebResources of script type

I have found strange issue in MS CRM 2013, and since it seems to be by design, I need help to find a way around it.
The issue is it's impossible to call getScript jQuery method from WebResource.
The CRM adds version string to the url, and this causes request fail with error 500.
For example, when I'm trying to call: /Organization/WebResources/Synchronization.js
The CRM turns this request into following: /Organization/WebResources/Synchronization.js?_=1402918931398 and it fails with server error 500.
Here is the sample code I'm using:
var settings = {
url: "/Organization/WebResources/Synchronization.js",
dataType: "script",
success: function (data) {
console.log("success");
},
error: function(jqXHR, textStatus, errorThrown) {
console.log("error");
}
};
$.ajax(settings);
Could you please point me, how I can find out when URL is changed?
It turns, that this is jQuery caching feature.
If caching will be turned on in settings object, the issue will disappear. Like this:
var settings = {
url: "/Organization/WebResources/Synchronization.js",
cache: true,
dataType: "script",
success: function (data) {
console.log("success");
},
error: function(jqXHR, textStatus, errorThrown) {
console.log("error");
}
};

Resend an ajax request if case of error or error code

I a javascript function which sends an ajax request. Note that the server might return an error even if "everything seems to be ok" which means that there might be an error information in the handler of success:
function sendAjaxRequest(){
$.ajax({
type: "GET",
url: "/123",
success: function(data){
//there might and might not an error in data
if(data.error_exists){
retryIfError(data);
} else{
//everything is ok for sure
}
},
error: function(xhr, textStatus, errorThrown){
//there is the error for sure
retryIfError(xhr);
}
});
}
function retryIfError(data){
var error = data.error_list # the array of error messages
// ... what should I do further?
}
The reason is that success: function(data) might have an error is that the server uses begin ... rescue operators to suppress them. Is that the right approach?
The second question:
So the goal is to send sendAjaxRequest() until there are no errors anymore. How do I do that? Of course, I want also restrict the amount of sending sendAjaxRequest() requests, but I think it will be trivial and I'll take care of it by myself.
What about calling the function again? you can add a counter as well.
error: function(xhr, textStatus, errorThrown){
if(i<3)
sendAjaxRequest(i++);
}
And use.
var i=0;

jQuery.ajax() sends POST requests as GET in a Chrome extension

I'm building a small Chrome extension that must send messages through a POST http request to a server in my company network, and I'm using jQuery 1.4.1 to speed up the development of the javascript part.
I have this code to send the request:
function send() {
$.ajax({
url: "http://mycompany.com/update",
method: "POST",
data: {status: "sometest", in_reply_to_status_id: "anId"},
success: function(data, textStatus) {
console.log("success");
console.log(data);
console.log(textStatus);
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
console.log("error");
console.log(XMLHttpRequest);
console.log(textStatus);
console.log(errorThrown);
},
complete: function(XMLHttpRequest, textStatus) {
console.log("complete");
}
});
}
The request done this way fails, in the Chrome log I see that the server responds with a http status 400 and with the text "This methods requires POST".
If I change to code above with this:
function send() {
$.post("http://sunshine.emerasoft.com/statusnet/api/statuses/update.xml", {status: "sometext", in_reply_to_status_id: "anId"}, function(data) {
console.log(data)
});
}
everything works fine, the http status is 200 and server side I can see that the data I sent is correctly saved.
I need to use the full $.ajax() method because I need to do some work in case of success or failure, and some other when the request is complete, so $.post() is not enough.
Am I doing something wrong calling $.ajax(), or there is an issue of some kind, maybe because I am in the xontext of a Chrome extension?
Thanks
I believe the $.ajax() function takes a 'type' option, not a 'method' option.
The default type is GET.

Categories

Resources