ajax sends second post request after success - ajax

I'm making an ajax post call on click of a button as below. But on success, the page is again submitted to the form-post url on the jsp page. I'm not sure why this is happening and how I can prevent the same.
Ajax call:
var urlsub = window.location.protocol + "//"+ window.location.host + contextPath+ "/saveEOI";
$.ajax({
type : "POST",
url : urlsub,
cache : false,
async: false,
data: {'applicationId' : applicationId
},
success : function(data) {
alert("success");
},
error : function(e) {
console.log(e);
}
});
The success alert is successfully shown, but after that another post request is generated for the jsp page form action...which causes a 405 error. I want to stop the execution after success.
<s:form action="expressEOI" class="form-horizontal" name= "EOI" id="EOI"
enctype="multipart/form-data" modelAttribute="expressEOIBean">
Request if anybody can help me out..where I am going wrong.

Related

why Ajax request is not working with spring tag library

I tried to submit form through Ajax but its not worked but
when i removed spring tag library than its worked fine..
so i want to know why Rest Api is not supports spring tag library
here is the ajax code for submit form
$("#change-password-by-otp").submit(function(event) {
console.log("submitting user reset password form");
event.preventDefault();
var email="${emailFromUser}";
console.log("hey hi--->"+email)
$('.error-message').empty();
$.ajax({
type : $(this).attr('method'),
url : $(this).attr('action'),
data : $(this).serialize(),
success :function(response, headers, HttpStatus) {
if(response.validated){
$('.center-content').html('<h5 class="text-success">password is changed</h5>')
}else{
$.each(response.errorsMap,function(key,value){
$('.error-messages').append('<span class="passworderror">'+value+'</span>'+
'<span class="glyphicon glyphicon-remove-sign" id= "remove-password"></span>');
});
}
},
error : function(error){
console.log("error===>"+error)
}
});
});
});

send url to ajax's success () from Django backend

I want to send data from HTML view to Django backend to process and then the backend will send an url back the to HTML view which will redirect the user to another page. It's like this:
Page 1 ----user's input data --- Ajax --- > backend --- process --- a url to page 2 --- Ajax --> page 2
The problem is that, I don't know how to send the URL back Ajax after processing user's data, so I have to redirect by using window.location.href = '/' . But I think the code is not clean this way. I wonder if there is a way to send url to Ajax's success from backend.
Here is the code n the HTML :
function doSomething(data){
$.ajax({
type: "POST",
url: URL_POST_BY_AJAX,
data: {
'data' : data,
},
success: function (response) {
window.location.href = '/';
},
error: function (data) {
alert('failed');
}
});}
Please help me. Thank you!
In your processing view:
from django.http.response import JsonResponse
def whatever_your_view_name_is(request):
(data processing...)
return JsonResponse({'url': the_url_to_page_2)
then in your JS:
(...)
success: function (response) {
window.location.href = response.url;
},
(...)

ajax request adding url paratemeters

I'm unsure if I'm just thinking of this the wrong way of thinking or I'm just missing something.
I have a search box that does some wildcard searches in a database. I have made this an ajax request so I don't need to reload the page and I can have a little please wait icon while the data loads.
Now as there is pagination so I could do with the url parameters being added to the url, can you do this on a ajax request, ad if so how?
here is a sample code (param1) :
data : $('#form-contactSupplementaire').serialize() + "&param1=value",
Request full ajax :
$.ajax({
method : "POST",
url : "...",
data : $("...").serialize() + "&param1=value",
dataType: "",
success : function (json) {
// ...
console.log(json);
}, error: function () {
console.log("Error");
}
});

Get an image through jQuery AJAX

The following image tag is in my Login Page
<img id="CaptchaImg" alt="Captcha" src="#url.action("Captcha","Login")" style="" />
Now when I refresh my login Page, it works fine, and gets the image from the controller, but when I logOut and the login Page renders .the controller method is not being called.Problem is only in IE works fine on Chrome.Is there are work around?
Can I do something with jQuery Ajax call to the controller, I tried this but the success method is not called. Is there any other way?
$.ajax({
type: "GET",
url: '/Login/CaptchaImage',
datatype: "image",
success: function(data) {
debugger
$('#CaptchaImg').attr('src', data);
}
});
Try this
$.ajax({
type: "GET",
url: '#Url.Action("Captcha","Login")',
dataType:"image/jpg",
success: function (data) {
$('#CaptchaImg').attr('src', data);
}
});
web Server should return base64 Data. like this
{ base64Data:"blahblahblah" }
your ajax request content-type could be plain json ;
in your success function in ajax you could do like this
success:function(data){
var src="data:image/png;base64,"+data.base64Data;
$('#CaptchaImg').attr(src,src)
}

Web service not called the second time if i make a request to webserver

I have an application made by using phonegap 1.5.0 and jquery mobile 1.1.0....
I have a structure like this
<div data-role="page" id="page1">
</div>
<div data-role="page" id="page2">
</div>
I call a webservice on page show of the page2 like this
$("#page2").on("pageshow", function(e) {
$
.ajax({
type : 'GET',
url : "http://192.168.1.88:9051/some.xml"
+ "?time=" + Date.now(),
data : {
key : "value"
},
dataType : "xml",
success : function(xml) {
},
error : function(xhr) {
alert("Error while loading the Mock Service !!!");
}
});
});
This works fine if i enter for the first time to Page2. Suppose if i navigate back to page1 and then again to Page2 then the webservice isnt called.
I even tried with pageinit and it didnt worked... Is this some Ajax issue?
How to rectify this?
Have you tried turning off caching?
// setup globally
$.ajaxSetup ({
cache: false
});
Or,
// setup individual calls
$.ajax({
cache: false, // disable caching
type : 'GET',
url : "http://192.168.1.88:9051/some.xml"
+ "?time=" + Date.now(),
data : { key : "value"},
dataType : "xml",
success : function(xml) {
},
error : function(xhr) {
alert("Error while loading the Mock Service !!!");
}
});
});
did you check with firebug, the "Console" and the "Net" tab to see what your script sends and receives?
$("#div")
looks wrong to me. should be either div (all div elemets) or #page1 (id 'page1')

Resources