web-dev-qa-db-fra.com

Redirection vers une autre page dans ASP.NET MVC à l'aide de JavaScript/jQuery

Je souhaite rediriger une page vers une autre page dans ASP.NET MVC 3.0 à l'aide de JavaScript/jQuery/Ajax. Sur le bouton clic événement, j'ai écrit le code JavaScript comme ci-dessous.

function foo(id)
{
    $.post('/Branch/Details/' + id);
}

Mon code de contrôleur est comme ceci:

public ViewResult Details(Guid id)
{
     Branch branch = db.Branches.Single(b => b.Id == id);
     return View(branch);
}

Lorsque je clique sur un bouton, il appelle l'action Détails dans BranchController, mais il ne revient pas à la vue Détails.

Je n'ai eu aucune erreur ou exception. Il affiche le statut 200 OK dans Firebug . Qu'est-ce qui ne va pas dans mon code et comment puis-je rediriger vers la page d'affichage Détails?

c#javascriptjqueryasp.net-mvc
61
user946393

Vous ne vous abonnez à aucun rappel de succès dans votre appel $ .post AJAX. Cela signifie que la demande est exécutée mais que vous ne faites rien avec les résultats. Si vous voulez faire quelque chose d’utile avec les résultats, essayez:

$.post('/Branch/Details/' + id, function(result) {
    // Do something with the result like for example inject it into
    // some placeholder and update the DOM.
    // This obviously assumes that your controller action returns
    // a partial view otherwise you will break your markup
});

D'autre part, si vous souhaitez rediriger, vous n'avez absolument pas besoin d'AJAX. Vous utilisez AJAX uniquement lorsque vous souhaitez rester sur la même page et ne mettre à jour qu'une partie de celle-ci. 

Donc, si vous vouliez seulement rediriger le navigateur:

function foo(id) {
    window.location.href = '/Branch/Details/' + id;
}

Remarque: vous ne devriez jamais coder en dur des URL comme celle-ci. Vous devez toujours utiliser des aides d’URL lorsque vous traitez avec des URL dans une application ASP.NET MVC. Alors:

function foo(id) {
    var url = '@Url.Action("Details", "Branch", new { id = "__id__" })';
    window.location.href = url.replace('__id__', id);
}
126
Darin Dimitrov

Pour ce faire, vous pouvez utiliser une variable masquée dans la vue, puis utiliser cette variable pour publier à partir du code JavaScript.

Voici mon code dans la vue

@Html.Hidden("RedirectTo", Url.Action("ActionName", "ControllerName"));

Maintenant, vous pouvez utiliser ceci dans le fichier JavaScript comme:

 var url = $("#RedirectTo").val();
 location.href = url;

Cela a fonctionné comme un charme de moi. J'espère que cela vous aide aussi.

36
Mridul

Vous pouvez utiliser:

window.location.href = '/Branch/Details/' + id;

Mais votre code Ajax est incomplet sans succès ni fonction d'erreur.

8
run
// in the HTML code I used some razor
@Html.Hidden("RedirectTo", Url.Action("Action", "Controller"));

// now down in the script I do this
<script type="text/javascript">

var url = $("#RedirectTo").val();

$(document).ready(function () {
    $.ajax({
        dataType: 'json',
        type: 'POST',
        url: '/Controller/Action',
        success: function (result) {
            if (result.UserFriendlyErrMsg === 'Some Message') {
                // display a Prompt
                alert("Message: " + result.UserFriendlyErrMsg);
                // redirect us to the new page
                location.href = url;
            }
            $('#friendlyMsg').html(result.UserFriendlyErrMsg);
        }
    });
</script>
4
Mike Brown
<script type="text/javascript">
    function lnkLogout_Confirm()
    {
        var bResponse = confirm('Are you sure you want to exit?');

        if (bResponse === true) {
            ////console.log("lnkLogout_Confirm clciked.");
            var url = '@Url.Action("Login", "Login")';
            window.location.href = url;
        }
        return bResponse;
    }

</script>
1
Muhammad Mubashir

vérifiez le code ci-dessous cela vous sera utile:

<script type="text/javascript">
  window.opener.location.href = '@Url.Action("Action", "EventstController")', window.close();
</script>
0
shahwaiz hasan