简体   繁体   English

ASP.NET MVC中类似UserControl的行为

[英]UserControl-like behavior in ASP.NET mvc

Decided to learn ASP.NET MVC and instantly got stuck on something simple. 决定学习ASP.NET MVC,并立即陷入一些简单的问题。

In Web Forms user controls allowed to separate application into components based on functionality and facilitated reuse. 在Web窗体中,用户控件允许根据功能将应用程序分为多个组件,并促进重用。 It seems partial views are supposed to do something similar in ASP.NET MVC, but either I am getting this wrong, or each visible page is handled by single controller and it is not possible to delegate certain page portions to separate controllers without hard-coding these controller relationships. 似乎局部视图在ASP.NET MVC中应该做类似的事情,但是或者我弄错了,或者每个可见页面都由单个控制器处理,并且不可能在不进行硬编码的情况下将某些页面部分委派给单独的控制器这些控制器关系。

RenderAction can render a partial view and insert resulting HTML in the page, but if we want this view to be refreshed when the user clicks on some link within this view together with the entire page, we need all the partial view links to refer to the parent controller? RenderAction可以呈现部分视图并将结果HTML插入页面中,但是如果我们希望在用户单击该视图中的某个链接以及整个页面时刷新此视图,则需要所有部分视图链接来引用该视图。父控制器?

For example: 例如:

Home\\Index.aspx: Home \\ Index.aspx:

<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<dynamic>" %>

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">Home</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
...
<% Html.RenderAction("Index", "Posts"); %>
...

Posts\\Index.aspx: 帖子\\ Index.aspx:

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<BlogEngine.Models.PostsViewModel>" %>

    <% foreach(var item in Model.Posts){ %>    
        <p class="postMeta"><%: string.Format("{0} {1}", item.CreatedAt, item.CreatedBy) %></p>
        <h1><%: item.Title %></h1>
        <div><%: item.Content %></div>
    <% } %>

    <% if (Model.CurrentPage > 0){ %>        
        <%: Html.ActionLink("Newer posts", "Index", "Home", new { page=Model.CurrentPage - 1}, null) %>
    <%} %>

    <% if (Model.CurrentPage + 1 < Model.TotalPages) { %>
        <%: Html.ActionLink("Older posts", "Index", "Home", new { page=Model.CurrentPage + 1}, null) %>
    <% } %>

PostsController: PostsController:

public class PostsController : Controller
{
    private const int PostsPerPage = 2;

    private readonly IPostRepository _postRepository;

    public PostsController()
    {
        ...
    }

    public ActionResult Index(int page = 0)
    {
        var model = new PostsViewModel();
        int totalPages = 1;
        model.CurrentPage = page;
        model.Posts = _postRepository.GetPosts(page, PostsPerPage, out totalPages);
        model.TotalPages = totalPages;

        return PartialView(model);
    }
}

There's got to be a better way than this? 有比这更好的方法吗?

I don't know if I understand correctly but you could load this Partial View in a using Ajax (by jQuery), and when you need to refresh only this part of content you reload the element. 我不知道我是否理解正确,但是您可以在使用Ajax(由jQuery)中加载此Partial View的情况下,并且当您只需要刷新这部分内容时,您就可以重新加载元素。 Something like this: 像这样:

In Javascript: 用Javascript:

function LoadComments(page) {
   //It'll return a partial view
   $("#comments").load("<%=Url.Action("Posts", "Index")%>?page=" + page); 
}

$(document).ready(function() {
   LoadComments(0); 
});

Inside of yoru PartialView you need to render a javascript code to call the "reload" of the next (page) content, so call LoadComments(index-page)... 在yoru PartialView内部,您需要呈现一个JavaScript代码来调用下一个(页面)内容的“重新加载”,因此调用LoadComments(index-page)...

Look the Ajax APi of jQuery: http://api.jquery.com/category/ajax/ 查看jQuery的Ajax APi: http : //api.jquery.com/category/ajax/

Cheers 干杯

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM