ASP.NET MVC - 执行控制器动作，不会重新导向 [英] ASP.NET MVC - Execute controller action without redirecting

问题描述

我想没有重定向到该行动相关的视图执行控制器上的操作。对于什么，我想实现看看的music.xbox.com网站一个很好的例子。当您从弹出菜单中的歌曲添加到播放列表中选择 - 页面只是显示一个通知，没有任何重定向或刷新。这怎么可能？

I am trying to execute an action on a controller without redirecting to the associated view for that action. For a good example of what I am trying to achieve take a look at the music.xbox.com website. When you add a song to a selected playlist from a popup menu - the page just shows a notification without any redirect or refresh. how is this possible?

我有如下：
我有呈现播放列表列表中选择一个_playlistPopupMenu部分观点如下：

What I have is the following: I have a _playlistPopupMenu partial view that renders the list of playlists as follows:

_PlaylistPopupMenu

_PlaylistPopupMenu

@model List<OneMusic.Models.GetPlaylists_Result>
@if (Model.Count > 0)
{
    <li style="height:2px" class="divider"></li>
    foreach (var item in Model)
    {
        <li style="height:30px">@Html.DisplayFor(p => item.Name)
            @Html.ActionLink(item.Name, "AddSong", "Playlist", new { playlistId =   @item.PlaylistId, songId = 1 }, "") 
       </li>
    }
} 

的PlaylistController AddSong操作如下：

The PlaylistController AddSong action is as follows:

public PartialViewResult AddSong(int? playlistId, int? songId)
{
    if (ModelState.IsValid)
    {
        db.AddSongToPlaylist(playlistId, songId);
        db.SaveChanges();
        return PartialView("_AddToPlaylist", "");
    }
    return PartialView("_AddToPlaylist", "");
}

我用什么把我认为我需要能够显示某种（Possiblly使用PNotify添加为引导）的通知_AddToPlaylist局部视图挣扎。 MVC要始终重定向到../播放列表/ AddSong playlistId = 1＆安培; songId = 1

I am struggling with what to put in the _AddToPlaylist partial view which I think I need to be able to display a notification of some kind (Possiblly using PNotify add in for Bootstrap). MVC wants to always redirect to ../Playlist/AddSong?playlistId=1&songId=1

这是如何完成这个问题的最后一部分，任何想法将是巨大的。

Any ideas on how to complete this last part of the problem would be great.

推荐答案

如果你不想全页面重新加载，那么你需要稍微不同的解决这个问题，使用JavaScript动态地改变页面。如 JQuery的库可能使操纵 DOM 更容易一些。

If you don't want "full page reloads" then you need to approach the problem slightly differently, using javascript to alter the page dynamically. A library such as JQuery might make manipulating the DOM a little easier.

1. 显示弹出式使用JavaScript动态。


2. 当用户点击OK /提交关于弹出，使用JavaScript发布数据传回服务器，并有您要发布帖子返回一些HTML控制器。


3. 附加返回的HTML块（局部视图）含有播放列表曲目现有DIV。

这最困难的部分是<一个href=\"http://stackoverflow.com/questions/133925/javascript-post-request-like-a-form-submit\">asynchronous帖子。有没有更新刷新整个页面的div帮助可以找到这个问题

The most difficult part of this is the asynchronous post. Help with updating a div without reloading the whole page can be found in this question.

修改 - 示例

如果你有一个控制器动作（接受的POST ）的URL 的myapp .COM /播放列表/ AddSong / ，那么你设置的JQuery张贴到这个网址。你想也设置了数据与任何形式的数据属性您想发帖，你的情况，你会添加 playistId 和 songId 到数据属性。

If you have a controller action (accepting POSTs) with the URL myapp.com/PlayList/AddSong/, then you'd set up JQuery to post to this URL. You'd also set up the data property with any form data which you'd like to post, in your case you'd add playistId and songId to the data property.

您最好再使用AJAX查询（HTML）的结果，并将其附加到页面上的现有的播放列表HTML。因此，假如要局部视图的HTML追加到ID为一个div playlistDiv ，并假设你的局部视图返回HTML时附加到现有的播放列表是有效的，那么您的JavaScript将是这个样子：

You'd then use the result of the AJAX query (HTML) and append it to the existing playlist HTML on the page. So assuming that you want to append the partial view's HTML to a div with ID playlistDiv, and assuming that your partial view returns HTML which is valid when appended to the existing playlist, then your javascript will look something like this:

var data = { playlistId = 1, songId = 1 };
$.ajax({
  type: "POST",
  url: 'http://myapp.com/PlayList/AddSong/',
  data: data,
  success: function(resultData) {
      // take the result data and update the div
      $("#playlistDiv").append(resultData.html)
  },
  dataType: dataType
});

免责声明：我不能保证这code将工作100％（除非我写的程序我自己）。有可能在JQuery的您使用等的版本的差异，但有一点调整它应该达到所期望的结果。

Disclaimer: I can't guarantee that this code will work 100% (unless I write the program myself). There may be differences in the version of JQuery that you use, etc, but with a little tweaking it should achieve the desired result.

这篇关于ASP.NET MVC - 执行控制器动作，不会重新导向的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！