I'm using the jQuery form plugin and when I use ajaxSubmit, the submission does happen (I checked for the 200 response) but the success callback is not called because I'm not seeing the alert(). Does anyone have any ideas as to why this is happening?
$("#edit-form form").submit(function() {
$(this).ajaxSubmit({
success: function(data){
alert("here")
},
method: "POST",
datatype: "json",
forceSync: true
});
return false;
});
EDIT: forgot to mention that the form is in an iframe (idk if that'll make a difference or not) created by a fancybox.
Related
I have functionality in which it is required to open file upload dialog after Ajax call success event.
What I tried:
I tried applying below simple code in ajax success: and complete: event but it is not working.
$.ajax({
url: url,
type: 'GET',
dataType: 'json',
data: { id: eoid },
contentType: 'application/json; charset=utf-8',
success: function (data) {
// some logic
$("#fileupload").click();
}
});
What is problem:
If I put simple button and try to execute above code, it is working fine and opening dialog - but it is not working in case of ajax post afterwards.
Any guesses or am I missing something?
Thank you.
The problem is at dataType: 'json' . You are loading html with your ajax request so you should change it to dataType: 'html' else in any other format it will not be considered success. Or you can delete this property as stated in Jquery doc that Jquery does default: Intelligent Guess (xml, json, script, or html).
I have a very simple $.ajax call that is suppose to get the json data from a given url. Currently the url does get called and the data does get returned, however the localHsonpCallback function doesn't seem to get fired.
Here is my code.
function getBuildings(){
$.ajax({
url: 'http://localhost/api/users',
type: "GET",
dataType: "jsonp",
jsonpCallback: "localJsonpCallback"
});
}
function localJsonpCallback(json) {
console.log("Fired");
if (!json.Error) {
console.log("Fired");
}
else {
console.log("ERROR");
}
}
So as mentioned above for some reason the localJsonpCallback doesn't seem to get fired at all.
Also I should mention that in my Chrome Dev tools the request link ends up looking like this for reason
http://localhost/api/users?callback=localJsonpCallback&_=1429708885454
Any help in this question would be greatly appreciated.
Thank you.
Try the callback method as an anonymous function directly inside the parameter list.
function getBuildings(){
$.ajax({
url: 'http://localhost/api/users',
type: "GET",
dataType: "jsonp",
jsonpCallback: function(data){
console.log("Fired");
if (!data.Error) {
console.log("Fired");
}
else {
console.log("ERROR");
}
}
});
}
If youre not appending the callback onto the url you can set the jsonp oprion to false and then, as you are doing, set the callback in the options.
function getBuildings(){
$.ajax({
url: 'http://localhost/api/users',
type: "GET",
dataType: "jsonp",
jsonp: false,
jsonpCallback: "localJsonpCallback"
});
}
Since javascript is sequential its also a good idea to define your functions before theyre called. ie - define your callback function before your ajax call.
http://api.jquery.com/jQuery.ajax/
jsonp
Type:
String Override the callback function name in a JSONP request.
This value will be used instead of 'callback' in the 'callback=?' part
of the query string in the url. So {jsonp:'onJSONPLoad'} would result
in 'onJSONPLoad=?' passed to the server. As of jQuery 1.5, setting the
jsonp option to false prevents jQuery from adding the "?callback"
string to the URL or attempting to use "=?" for transformation. In
this case, you should also explicitly set the jsonpCallback setting.
For example, { jsonp: false, jsonpCallback: "callbackName" }
Maybe this piece of code it will help solve your problem:
$.ajax({
type: 'GET',
url: 'http://localhost/api/users',
data:{todo:"jsonp"},
dataType: "jsonp",
crossDomain: true,
cache:false,
success: success,
error:function(jqXHR, textStatus, errorThrown){
alert(errorThrown);
}
});
var success = function(data){
/* parse JSON */
data = $.parseJSON(data);
//your code here
};
This either a server side problem that the callback parameter is not used properly or the parameter name callback does not exist for the server side they are looking for something different.
You said the result is returning, what is the format? JSONP must return a script block not pure data so be sure the result is in below format.
{callbackFunctionName}({hugeDataFromServer});
Basically it is script that calls your function.
if it is not the server side that means it is more likely they are using a different name for callback parameter e.g. cb , _callback etc
I'm loading comments with ajax in my website, and I'm sending to users notification with an anchor to the specific comment.
The anchor is not working, that piece of DOM isn't loaded yet.
How can I handle this? Maybe something "on ajax complete" ? I can do a script that launch "on ajax complete", but I don't know how to manage the anchor in the url.
$.ajax has a complete() callback that you can put code into. you can run location.hash = yourAnchorHash.
You could use jQuery's complete or success callback depending on whether you only want your code to fire when the call is successful or always when the call is complete.
$.ajax({
type: "POST",
url: "yourURL",
contentType: "application/json; charset=utf-8",
data: yourData,
async: true,
success: function (msg) {
//get stuff done when ajax call is successful
},
complete: function()
{
//get stuff done when ajax call is complete
}
});
I'm using jQuery to perform following AJAX request:
jQuery.ajax({
url: "url-to-script",
dataType: "html",
async: false,
success: function(data) {
console.log(data);
},
error:function(){
showMessage('Chyba', 'error');
}
});
Script that I'm calling is returning part of HTML. It is working properly.
But when I call this AJAX it will end with blank response in data. When I call it again it will return what it should and each next call is working. But the first one after page load is never working. I've no idea why.
I've also tried
if (data)
// do something
else
try again
But it just freeze my browser. So I don't know what is wrong.
Thanks for ideas!
I'm going absolutely crazy... I keep getting an "invalid label" error in Firebug when executing this simple piece of Javascript:
$(document).ready(function(){
$.ajax({
url: "http://jsonip.com",
dataType: "jsonp",
success: function(data) {
alert("success!")
}
});
});
Firebug will say (in the console tab):
Invalid label
{"ip":"99.99.99.99"}
with a pointer to the first double quotes (IP address mocked for obvious reasons).
The call in in the net tab is what one would expect: http://jsonip.com/?callback=jQuery17108684927028894522_1326752040735&_=1326752042159, so the callback parameter is in place too.
I'm using jQuery 1.7.1. I have also tried this with jQuery 1.6.4 but without success.
Anyone...? Thanks!
To specify a JSONP callback to jsonip.com you must to put the callback name like this:
http://jsonip.com/{theCallback}
To do this with jQuery, there are some simple configurations to the ajax method. This code works for me:
$(document).ready(function() {
$.ajax({
url: "http://jsonip.com/theCallbackFunction",
dataType: "jsonp",
jsonp: false,
jsonpCallback: "theCallbackFunction",
success: function(data) {
alert(data.ip);
}
});
});
Regards!
The callback function seems to be passed as a url fragment. Check the fiddle
Regarding to the answer by eagleoneraptor and the comment by lonesomeday:
You may create a dynamic name for the callback-function on the fly and append that name to the url:
$.ajax({
url: "http://jsonip.com/",
dataType: "jsonp",
jsonpCallback:function(){var fnc='cb'+$.now();this.url+=fnc;return fnc;},
jsonp:false,
success: function(data) {
alert(data.ip)
}
});
http://jsfiddle.net/doktormolle/YfHYs/
I run jsonip.com.
The service now supports:
CORS
path callbacks, http://jsonip.com/myfunc => myfunc({"ip":""})
parameter callbacks, http://jsonip.com/?callback=myfunc => myfunc({"ip":""})
Note that for the parameter callbacks, ?callback is required. "myfunc" can, of course, be whatever you want.
See http://jsonip.com/about for details.