I have the following ajax request:
function getDetails()
{
$.ajax({
type: 'GET',
url: 'http://xxxxxx/get_determined_prize.php',
success: function(result)
{
alert(result);
},
fail: function()
{
console.log("Failure!!");
}
});
}
which calls the following php file containing the following code:
<?php
echo "5";
?>
can someone pinpoint what is the problem with my code? when i debugged the javascript method, during the execution of the ajax request, both the success and failure methods where skipped.
Please follow the link and try this
http://api.jquery.com/jQuery.ajax/
var request= $.ajax({
type: 'GET',
url: 'http://url/get_determined_prize.php',
success: function(result)
{
alert(result);
}
});
request.fail( function()
{
console.log("Failure!!");
});
jqXHR.fail(function( jqXHR, textStatus, errorThrown ) {});
An alternative construct to the error callback option, the .fail() method replaces the deprecated .error() method. Refer to deferred.fail() for implementation details.
Related
The alert from done function is executing before success. Please help me. What am I doing wrong here:
function load_organization()
{
return $.ajax({
url: '/partials/structure',
method: "GET",
data: {id:id},
success: function (data) {
$(data.organizations).each(function(index, organization) {
$("#organization").append(new Option(organization));
});
}
});
}
$(document).ready(function(){
load_organization().done(function(){
alert('Success');
});
});
"Done" is a callback triggered from a running XHR instance with jQuery.
The doc says:
jqXHR.done(function( data, textStatus, jqXHR ) {});
An alternative construct to the success callback option, refer to deferred.done() for implementation details.
Take a look:
function load_organization()
{
$.ajax({
url: '/partials/structure',
method: "GET",
data: {id:id},
success: function (data) {
$(data.organizations).each(function(index, organization) {
$("#organization").append(new Option(organization));
});
}
})
// Use done here -> look official API doc for some explanations: http://api.jquery.com/jQuery.ajax/
.done(function(){
alert('Success');
});
}
$(document).ready(function(){
load_organization();
});
Hope this could help you in your solution
You are executing alert('Success'); when load_organization() is called. so irrespective of ajax, the message is displaying. You can alert the success in same single function. And .done() has only one callback and it is the success callback.
function load_organization()
{
return $.ajax({
url: '/partials/structure',
method: "GET",
data: {id:id},
success: function (data) {
$(data.organizations).each(function(index, organization) {
$("#organization").append(new Option(organization));
alert('Success');
});
}
});
}
I'm making an Ajax request that works perfectly fine. The issue I'm having is that I attached the "error" method onto the call and when I modify the URL to try to make it throw an error....I get no error. Here is my code:
function instagramAjax () {
$.ajax ({
url: "url that works",
dataType: "jsonp",
success: function(returnedData) {
//my success code that works
},//end success
error: function(jqXHR, textStatus, errorThrown) {
console.log("Error " + errorThrown);
}
});//end ajax request
}//end instagramAjax function
What is the url that you'd set?
This handler is not called for cross-domain script and cross-domain JSONP requests.
window.MyCallback = function (data) {
console.log(data);
};
function instagramAjax () {
$.ajax ({
url: "url that works",
dataType: "jsonp",
crossDomain: true,
jsonpCallback: 'MyCallback',
success: function(returnedData) {
//my success code that works
},//end success
error: function (xhr, status, err) {
console.log(status, err);
}
});//end ajax request
}//end instagramAjax function
or you can do it:
function instagramAjax () {
$.ajax ({
url: "url that works",
dataType: "jsonp",
crossDomain: true,
jsonp: 'MyCallback',
success: function(returnedData) {
//my success code that works
},//end success
error: function (xhr, status, err) {
console.log(status, err);
}
});//end ajax request
}//end instagramAjax function
My .jsp page partial code
function runAjax(){
$.ajax({
type: "POST",
url: "Test.html",
data: { testparam1,testparam2},
success: function(data){
document.getElementById("processdata").innerHTML="Success";
},
error: function(e){
document.getElementById("processdata").innerHTML="Error";
}
});
}
In my controller that handles the post, i raise an error on purpose for testing. The client code shows the message 'Error'. With same session, i refresh my page and run it so that the error is not raised. INstead of "Success" I still see 'Error" even though i know the controller worked as expected.
should i be doing this
function runAjax(){
$.ajax({
type: "POST",
url: "Test.html",
data: { testparam1,testparam2},
success: function(data){
document.getElementById("processdata").innerHTML="Success";
},
error: function(request){
document.getElementById("processdata").innerHTML="Error";
}
});
}
and then in the controller
try{
...
}catch(Exception e)
{
response.getWriter().print("An error occured");
}
If in my original code the error is being cached, how do I clear it each time my controller is called?
I am trying to use jsonp to access the data at:
https://github.com/users/jbranchaud/contributions_calendar_data
However, none of the solutions I have tried are resulting in either the callback or the success function getting invoked. When I use Chrome/Firefox inspection tools, I can look at the script and see that the response was 200 Ok and that the response text contains the data from the above URL. Nevertheless, neither the callback function nor the success function get called at any point. Any ideas about how to get this to work?
Here is my most recent attempt at getting this to run:
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
function parseResults(results) {
console.log('hello function callback.');
}
$.ajax({
url: 'https://github.com/users/jbranchaud/contributions_calendar_data',
type: 'post',
dataType: 'jsonp',
jsonp: true,
jsonpCallback: 'parseResults',
success: function(data, textStatus, jqXHR) {
console.log('success_function');
console.log(data);
},
error: function() {
console.log('error with jsonp request');
}
});
</script>
When I load the page, I see the 'error with jsonp request' in the console, so there is an error with the ajax request. Ideas of why this request isn't succeeding?
In the ajax request, try to set the attribute 'jsonp' to false (jsonp: false).
Basically, JQuery generate an automatic function callback name, like this : JQuery1223...34.
In your case, you ,already, explicitly set the jsonpCallback function name. so you have to put jsonp attribut to false.
your code should be like this :
$.ajax({
url: 'https://github.com/users/jbranchaud/contributions_calendar_data',
type: 'post',
dataType: 'jsonp',
jsonp: false,
jsonpCallback: 'parseResults',
success: function(data, textStatus, jqXHR) {
console.log('success_function');
console.log(data);
},
error: function() {
console.log('error with jsonp request');
}
});
I am trying to submit a form with the user's inserted data and get the html back from the page called (update.asp).
How do I get the html response and how do I write it to a div on the page? The response would be "success".
If my page throws a 500 or other type of error, how can I handle that?
$('input#btnUpdate').click( function() {
$.ajax({
url: 'update.asp',
type: 'post',
dataType: 'json',
data: $('form#myForm').serialize(),
success: function(data) {
// how do i catch the response? is this the right place?
},
error: function(data) {
// how do I catch the error code here?
}
});
The response from the server in both cases would be passed to the callback as the data variable in your example. Try using console.log(data) inside of your callbacks to see the result in your developer console.
$('input#btnUpdate').click( function() {
$.ajax({
url: 'update.asp',
type: 'post',
dataType: 'json',
data: $('#myForm').serialize(),
success: function(response) {
$("#yourDIV").html(response);
},
error: function (xhr, ajaxOptions, thrownError) {
alert(thrownError); //output, 500
}
});
});
More on this: ajax()