javascript - Redirect to another page after Ajax call? - Stack Overflow

admin管理员组

文章数量:1290340

so this is a hard one for me to try and explain. I have a razor page that when a button is clicked it calls a javascript function which makes an ajax call to a handler in the back end. The handler does some stuff and gets a id that I want to pass to another page. I am trying to use the RedirectToPage function in the back end but the screen never opens. It successfully calls the handler but when the handler does its return, nothing happens. Is there a way to do this?

Here is the javascript/ajax code that gets called from a button being clicked.

@section scripts{
<script>

// Get the account ID Data from the row selected and return that to the program.
function getIDData(el) {        

    var ID = $(el).closest('tr').children('td:first').text();
    var iddata = {
        'ID': ID
    }        

    console.log(iddata);
    return iddata;
}

// Submit the data to a function in the .cs portion of this razor page.
$('.copybtn').click(function () {
    var accountid = JSON.stringify(getIDData(this));
    $.ajax({
        url: '/Copy_Old_Account?handler=CopyData',
        beforeSend: function (xhr) {
                        xhr.setRequestHeader("XSRF-TOKEN",
                                $('input:hidden[name="__RequestVerificationToken"]').val());
                },
        type: 'POST',
        dataType: 'json',            
        data: { offenderid: offenderid },    
        success: function (result) { 

        }, 
    });
});

</script>
}

For my code behind code that I am calling from the ajax call, that's below here:

public ActionResult OnPostCopyData (string accountid)
{
   // Do my other stuff here
   return RedirectToPage("Account_Information", new { id = account.Account_ID });
}

Any help would be appreciated and if doesn't make sense, I can try and clear up any questions.

so this is a hard one for me to try and explain. I have a razor page that when a button is clicked it calls a javascript function which makes an ajax call to a handler in the back end. The handler does some stuff and gets a id that I want to pass to another page. I am trying to use the RedirectToPage function in the back end but the screen never opens. It successfully calls the handler but when the handler does its return, nothing happens. Is there a way to do this?

Here is the javascript/ajax code that gets called from a button being clicked.

@section scripts{
<script>

// Get the account ID Data from the row selected and return that to the program.
function getIDData(el) {        

    var ID = $(el).closest('tr').children('td:first').text();
    var iddata = {
        'ID': ID
    }        

    console.log(iddata);
    return iddata;
}

// Submit the data to a function in the .cs portion of this razor page.
$('.copybtn').click(function () {
    var accountid = JSON.stringify(getIDData(this));
    $.ajax({
        url: '/Copy_Old_Account?handler=CopyData',
        beforeSend: function (xhr) {
                        xhr.setRequestHeader("XSRF-TOKEN",
                                $('input:hidden[name="__RequestVerificationToken"]').val());
                },
        type: 'POST',
        dataType: 'json',            
        data: { offenderid: offenderid },    
        success: function (result) { 

        }, 
    });
});

</script>
}

For my code behind code that I am calling from the ajax call, that's below here:

public ActionResult OnPostCopyData (string accountid)
{
   // Do my other stuff here
   return RedirectToPage("Account_Information", new { id = account.Account_ID });
}

Any help would be appreciated and if doesn't make sense, I can try and clear up any questions.

• javascript
• ajax
• asp-mvc
• razor-pages

Share Improve this question Follow edited Aug 17, 2018 at 21:03 Erik Philips 54.6k1111 gold badges131131 silver badges156156 bronze badges asked Aug 17, 2018 at 19:30 JestesJestes 11122 gold badges22 silver badges1010 bronze badges 6

• Have you try to return the id, and then redirect in the success state from the ajax request? – joseatchang Commented Aug 17, 2018 at 19:42
• @joseatchang I have not tried that and I'm not sure exactly how to do that. Do you have any examples I could look at? – Jestes Commented Aug 17, 2018 at 20:28
• look into the first answer, he's referring to the object pass to ajax method, success will trigger once it gets an positive response for the request. – joseatchang Commented Aug 17, 2018 at 20:31
• A vanilla html form might be a better choice over ajax, since you’re not trying to send/retrieve data without reloading the page. – James Commented Aug 17, 2018 at 20:39
• 1 Possible duplicate of How to manage a redirect request after a jQuery Ajax call – Erik Philips Commented Aug 17, 2018 at 21:03

 |  Show 1 more ment

2 Answers 2

Sorted by: Reset to default 5

I think this is what you want, I did something similar in an MVC 5 project and I haven't tested it in Razor Pages yet:

This would be your method, note that you should add your Controller to the Url.Action, and I personally haven't tried passing a parameter along with the url but I image it'll work just fine

[HttpPost]
public ActionResult SubmitSomething()
{
    return Json(new { redirectUrl = Url.Action("Account_Information", "YOUR_CONTROLLER_NAME", new { id = account.Account_ID }) });
}

And then this would be your Ajax request, I updated the success portion

// Submit the data to a function in the .cs portion of this razor page.
$('.copybtn').click(function () {
    var accountid = JSON.stringify(getIDData(this));
    $.ajax({
        url: '/Copy_Old_Account?handler=CopyData',
        beforeSend: function (xhr) {
                        xhr.setRequestHeader("XSRF-TOKEN",
                                $('input:hidden[name="__RequestVerificationToken"]').val());
                },
        type: 'POST',
        dataType: 'json',            
        data: { offenderid: offenderid },    
        success: function (result) { 
            if (result.redirectUrl !== undefined) {
                window.location.replace(result.redirectUrl);
            } else {
                // No redirect found, do something else
            }
        }, 
    });
});

This isn't tested, so I can only hope that it works for you right now

Edit: Updated the Url.Action to use OP's view names and parameters

Redirect to page returns a 301 response, which will be in the format:

HTTP/1.1 301 Moved Permanently
Location: http://www.example/index.asp

To redirect after the ajax call you can redirect to the requested url by:

success: function (result) { 
window.location = result.getResponseHeader('Location');
}

本文标签： javascriptRedirect to another page after Ajax callStack Overflow