加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 编程开发 > asp.Net > 正文

asp.net-mvc – ASP.NET MVC – 执行控制器操作而不重定向

发布时间:2020-12-16 04:30:17 所属栏目:asp.Net 来源:网络整理
导读:我试图在控制器上执行操作,而不重定向到该操作的关联视图.有关我想要实现的一个很好的例子,请查看music.xbox.com网站.从弹出菜单向选定的播放列表添加歌曲时 – 该页面只显示没有任何重定向或刷新的通知.这怎么可能? 我所拥有的是以下内容: 我有一个_playl
我试图在控制器上执行操作,而不重定向到该操作的关联视图.有关我想要实现的一个很好的例子,请查看music.xbox.com网站.从弹出菜单向选定的播放列表添加歌曲时 – 该页面只显示没有任何重定向或刷新的通知.这怎么可能?

我所拥有的是以下内容:
我有一个_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操作如下:

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

我正在努力放入_AddToPlaylist局部视图中的内容,我认为我需要能够显示某种类型的通知(Possiblly使用PNotify添加为Bootstrap). MVC希望始终重定向到../Playlist/AddSong?playlistId=1u0026amp;songId=1

关于如何完成问题的最后部分的任何想法都会很棒.

解决方法

如果您不想要“完整页面重新加载”,那么您需要稍微改变问题,使用javascript动态更改页面.像 JQuery这样的库可能会让 DOM更容易操作.

>使用javascript动态显示弹出窗口.
>当用户在弹出窗口中点击“确定/提交”时,使用javascript将数据发布回服务器,并让您发布的控制器返回一些HTML.
>将返回的HTML块(部分视图)附加到包含播放列表轨道的现有div.

最困难的部分是asynchronous post.有关更新div而不重新加载整个页面的帮助可以在this question找到.

编辑 – 示例

如果您使用URL myapp.com/PlayList/AddSong/进行控制器操作(接受POSTs),那么您需要设置JQuery以发布到此URL.您还可以使用您要发布的任何表单数据设置data属性,在您将dataistId和songId添加到data属性的情况下.

然后,您将使用AJAX查询(HTML)的结果并将其附加到页面上的现有播放列表HTML.因此,假设您要将部分视图的HTML附加到具有ID播放列表Div的div,并假设您的部分视图返回HTML,该HTML在附加到现有播放列表时有效,那么您的javascript将如下所示:

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
});

免责声明:我无法保证此代码可以100%正常工作(除非我自己编写程序).您使用的JQuery版本可能存在差异等,但稍微调整它应该可以达到预期的效果.

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读