How do redirect in Ajax Post? - javascript

Im trying to redirect Ajax post in a success function
Here's the code
$.ajax({
type: "POST",
url: "/api/create-room/",
data:{
targetedUser,
},
success: function(data) {
// How to redirect in here??
}
});

You could use window.location.replace or window.location.href inside the success function :
$.ajax({
type: "POST",
url: "/api/create-room/",
data:{
targetedUser,
},
success: function(data) {
window.location.replace("url"); //Simulate HTTP redirection
//Or
window.location.href = "url"; //Simulate click on a link
}
});
For more information you could check This post.
Hope this helps.

Related

Is It possible to change URL via AJAX in laravel?

My current URL is http://localhost/create-story/galleries/wedding
Want to Make URL is http://localhost/create-story/galleries/wedding?query=VALUE_FROM_AJAX_RECIEVER
My Ajax function is
function liveSearch(val) {
$.ajax({
url: "{{ route('search_wedding') }}",
method: 'GET',
data: {query: val},
dataType: 'json',
success: function (data) {
$('#gallery').html(data);
}
})
}
$('#btn-bridal').on('click', function () {
liveSearch($(this).text());
});
Is It possible to change URL from AJAX after success? want to add request value In Url. Thanks
I think this will do the trick for you:
function liveSearch(val) {
let url = "{{ route('search_wedding') }}?query=" + val;
window.location = url;
}
$('#btn-bridal').on('click', function () {
liveSearch($(this).text());
});
If it doesn't work please comment it and I will delete the answer if it's not bringing any result.

Call JSON inside AJAX success

I want to call a json data inside my AJAX success. I'm still new on manipulating json and AJAX. Can somebody help me on how to access my json data which is from another URL? And I want to compare the id to the JSON data. Here's my code so far:
function getCard(id){
$.ajax({
type: "GET",
data: "id=" + id,
success: function(data){
#call JSON data here from another URL
# Is it possible to call another AJAX here?
}
});
}
This code will work for you
$.ajax({
url: "url",
method: "post",
data: "id=" + id,
success:function(data) {
// success goes here
$.ajax({
url: "url",
async:false,
method: "post",
data: "id=" + id,
success:function(json) {
JSON.parse(json);
// compare data and json here
},
error: function(){
// error code goes here
}
});
},
error: function(){
// error code goes here
}
});
yes Zuma you can call another Ajax inside Success function of Ajax call. Below is the example:
$.ajax({
type: "post",
url: url1,
data: data1,
success: function(data){
$.ajax({
type: "post",
url: url2,
data: data2,
success: function(data){
});
});
});
function getCard(id){
$.ajax({
type: "Get",
url: "发送请求的地址",
data: "id=" + id,
success: function(data){
#call JSON data here from another URL
# if success,you can call another AJAX.
# Is it possible to call another AJAX here?
# yes!
}
});
}

JQuery AJAX - How to refresh/reload page using a method GET call

For some reason I can't make this code work, I am trying to reload/refresh the page using GET. All the sample codes that I have found uses POST but I can't go to that because our forms require GET.
This is my code:
$.ajax({type: "GET",
url: "CorrectResults",
data: data,
beforeSend: function() {
console.log("Submitting Data");
},
cache: false,
success: function(html) {
document.location.reload();
//location.reload(true);
//$("#acceptDiv").html(html);
}
});
It should be a simple way to get this done, why this is so easy with POST and not with GET?
Here we go:
$.ajax({type: "GET",
url: "CorrectResults",
data: data,
beforeSend: function() {
console.log("Submitting Data");
},
cache: false,
success: function(html) {
window.location.href= "../yourUrl";
}
});
Hope it helps;)
if you have not any other error in your script( please go to console in your browser press F12),
then you can try with location.reload();
in your success method, like that:
$.ajax({type: "GET",
url: "CorrectResults",
data: data,
beforeSend: function() {
console.log("Submitting Data");
},
cache: false,
success: function(html) {
location.reload();
}
});

Ajax redirect on error

I'm calling php file through ajax call and if it returns nothing i want to redirect user to another page (It's for error reports, if it doesn't return anything it means that user logged in). Tried to add error section but it doesn't work. Any suggestions will help. Thanks! Btw, I have small jQuery function at the top of the ajax function, why it breaks my whole ajax call?
ajax.js
function loginAjax() {
//$("#email_errors").empty(); //This function doesnt work and kills whole ajax call. Here is loginAjax function call line - <button type = "submit" id = "push_button" onclick = "loginAjax(); return false">PushMe</button>
$.ajax({
url: "Classes/call_methods_login.php",
type: "POST",
dataType: "json",
data: {
login_email: $("#login_email").val(),
login_password: $("#login_password").val(),
},
success: function(data) {
$("#login_error").html(data.login_message);
}
});
}
$.ajax({
url: "Classes/call_methods_login.php",
type: "POST",
dataType: "json",
data: {
login_email: $("#login_email").val(),
login_password: $("#login_password").val(),
},
success: function(data) {
$("#login_error").html(data.login_message);
},
error: function(){
window.location.replace("http://stackoverflow.com");
}
});
}
To redirect using javascript all you need to do is override the location.href attribute.
function loginAjax() {
$.ajax({
url: "Classes/call_methods_login.php",
type: "POST",
dataType: "json",
data: {
login_email: $("#login_email").val(),
login_password: $("#login_password").val(),
},
// the success method is deprecated in favor of done.
done: function(data) {
$("#login_error").html(data.login_message);
},
fail: function(data) {
location.href="path/to/error/page";
}
});
}

When i use the window.close ajax call not working?

I have the small window in my page when click the button the window value send my controller and close the window. But when i use the window.close the controller not hit. But without window.close its hits properly. But i need that line for close the window.How i manage that?
My sample Code is give below:
function click() {debugger;
$.ajax({
type: 'POST',
url: 'my url'
data: { status: $('#Field_Error')[0].checked },
dataType: 'json',
success: function (data) {
alert(data.message);
}
});
window.close();
}
controller:
public ActionResult actionName(bool status)
{// not hit here
}
Call window.close from inside success function
$.ajax({
type: 'POST',
url: 'my url'
data: { status: $('#Field_Error')[0].checked },
dataType: 'json',
success: function (data) {
alert(data.message);
window.close();
}
});
Ajax is async in nature. It does not wait for ajax to complete. So window.close called early w/o completing ajax.
put the window.close in succes, jquery doesn't wait for ajax to finish, it goes on.
function click() {debugger;
$.ajax({
type: 'POST',
url: 'my url'
data: { status: $('#Field_Error')[0].checked },
dataType: 'json',
success: function (data) {
alert(data.message);
window.close();
}
});
}
function click() {
var myurl=test.php;
$.ajax({
type: 'POST',
url: 'myurl',
data: { status: $('#Field_Error')[0].checked },
dataType: 'json',
success: function (data) {
alert('successmsg');
window.close();
}
});
}

Categories