通过AJAX路由

Question

I have an ajax request handling validation of form fields (login+signup+forget password). In its success scenario, I want it to route to another page, but when I use Redirect::route('name'); as return from controller, it completes the request with 200 and generates another GET request which just returns the html as response and does not route to other page.

AJAX

$('form[data-remote]').on('submit', function (e) {
    var form = $(this);
    var method = form.find('input[name="_method"]').val() || 'POST';
    var url = form.prop('action');
    $.ajax({
        type: method,
        url: url,
        data: form.serialize(),
        beforeSend: function () {
            $('#ajax-loading').show();
            $(".has-error").text("");
            $('#login-error').addClass('display-hide');
            $('#forget-user-error').addClass('display-hide');
        }
    })
        .done(function (data) {
            if (data.signup_fail) {
                $.each(data.errors, function (index, value) {
                    var errorSpan = '#' + index + '_error';
                    $(errorSpan).removeClass('hidden');
                    $(errorSpan).empty().append(value);
                });
                $('#successMessage').empty();
            }
            else if (data.email_fail) {
                $('#email_error').text('This Email already in use against an account.');
            }
            else if (data.company_fail) {
                $('#email-error-popup').trigger('click');
            }
            else if (data.login_fail) {
                $('#login-error').removeClass('display-hide');
            }
            else if (data.forget_fail) {
                $.each(data.errors, function (index, value) {
                    var errorSpan = '#' + index + '_error';
                    $(errorSpan).empty().append(value);
                });
                $('#successMessage').empty();
            }
            else if (data.forget_user_fail) {
                $('#forget-user-error').removeClass('display-hide');
            }
            else if (data.reset_fail) {
                $.each(data.errors, function (index, value) {
                    var errorSpan = '#' + index + '_error';
                    $(errorSpan).removeClass('hidden');
                    $(errorSpan).empty().append(value);
                });
                $('#successMessage').empty();
            }
        })
        .fail(function (jqXHR, ajaxOptions, thrownError) {
            alert('No response from server');
        });
    return false;
});

How can I route to the other page on success condition? The ajax is triggered on a form submit button.

Answer 1

As you are doing an ajax request you can't just redirect from the controller on successful validation. Instead, just return the url you want to redirect to, as response to the ajax request similar to the way you are returning the validation errors. And in your js file use that url to redirect to new page.

             #your above code

                else if (data.forget_user_fail) {
                    $('#forget-user-error').removeClass('display-hide');
                }
                else if (data.reset_fail) {
                    $.each(data.errors, function (index, value) {
                        var errorSpan = '#' + index + '_error';
                        $(errorSpan).removeClass('hidden');
                        $(errorSpan).empty().append(value);
                    });
                    $('#successMessage').empty();
                 }
                 else{
                      window.location.replace(data.redirect_url); //this will redirect to new page
                 }
        })
        .fail(function (jqXHR, ajaxOptions, thrownError) {
            alert('No response from server');
        });
    return false;
});