c# - 使用 Razor MVC3 的发送者-接收者

Question

我想构建一个 Sender-Receiver，每个都有两个 PartialView，并通过 Controller 中的发送方法连接它们。 Ajax 操作调用需要必须重新呈现的 div 的 Id。但我希望发送方与接收方完全分离。

我可以在不使用 AjaxOptions.UpdateTargetId 的情况下重新呈现 PartialView(例如在 Controller 本身中)吗？

想法是允许多个接收者连接到一个发送者(类似于 WebParts 机制)。

索引 View :

@{
    ViewBag.Title = "Test Ground";
    var sender = (MVCPortalViewModel.Models.SenderModel)ViewBag.Model.PortletModels["Sender"];
    var receiver = (MVCPortalViewModel.Models.ReceiverModel)ViewBag.Model.PortletModels["Receiver"];
}
<p>@Html.Partial("SenderPartView", sender)</p>
<p>@Html.Partial("ReceiverPartView", receiver)</p>

发件人 View :

@model MVCPortalViewModel.Models.SenderModel

@using (Ajax.BeginForm("ApplyColor", "Test", new { Color = @Model.Color }, new AjaxOptions { UpdateTargetId = @ViewBag.SenderDivId, HttpMethod = "Post" }))
{
    <div id="senderPartDiv" style="border: 1px solid black;">
        <div style="background-color: @Model.Color">
            <h2>@Model.Title</h2>
        </div>
            <p>Hallo @Html.ViewContext.HttpContext.User.Identity.Name</p>
            <p>
                @Html.Editor("Color")
                <input type="submit" value="Apply Color" />
            </p>
            <p>
                @Ajax.ActionLink("Send Color", "SendColor", new { Color = @Model.Color }, new AjaxOptions { UpdateTargetId = @ViewBag.ReceiverDivId, HttpMethod = "Post" })
            </p>
    </div>
}

接收者 View :

@model MVCPortalViewModel.Models.ReceiverModel

<div id="receiverPartDiv" style="border: 1px solid black;">
    <h2 style="background-color: @Model.Color">@Model.Title</h2> 
    <p>Color: @Model.Color</p>
</div>

Controller :

public class TestController : Controller
{
    public ActionResult Index()
    {
        ViewBag.Model = Model;
        ViewBag.ReceiverDivId = "receiverPartDiv";
        ViewBag.SenderDivId = "senderPartDiv";
        return View();
    }

    public ActionResult SendColor(string Color)
    {
        var receiverModel = ((ReceiverModel)Model.PortletModels["Receiver"]);
        receiverModel.Color = Color;

        ViewBag.ReceiverDivId = "receiverPartDiv";
        ViewBag.SenderDivId = "senderPartDiv";

        return PartialView("ReceiverPartView", receiverModel);
    }
}

Answer 1

除了客户端 JQuery 方法之外，我想出了一个使用 RenderAction 和一个单独的接收器 Controller 的解决方案。

索引 View :

@model MVCPortalViewModel.Models.SenderModel
<p>@Html.Partial("Sender", Model)</p>
<p>
    @{ Html.RenderAction("Receive1", "Receiver", Model); }
    @{ Html.RenderAction("Receive2", "Receiver", Model); }
</p>

发件人局部 View :

@model MVCPortalViewModel.Models.SenderModel
@using (@Html.BeginForm(new { Color = @Model.Color }))
{
    <h2 style="background-color: @Model.Color;">@Model.Title</h2>
    <p>
        Send Color: 
        @Html.Editor("Color")
        <input type="submit" value="Send Color" id="sendButton" />
    </p>
}

接收器局部 View :

@model MVCPortalViewModel.Models.ReceiverModel
<h2 style="background-color: @Model.Color">@Model.Title</h2>
<p>
    Color: 
    @Html.Display("Color")
</p>

Controller :

public class ChildActionController : Controller
    {
        public ActionResult Index(string Color)
        {
            SenderModel sender = new SenderModel { Title = "Sender", Color = "red" };
            if (!string.IsNullOrEmpty(Color))
            {
                sender.Color = Color;
            }
            return View(sender);
        }
}

用于连接的接收器 Controller :

public class ReceiverController : Controller
    {
        public ActionResult Receive1(SenderModel Sender)
        {
            ReceiverModel receiver = new ReceiverModel { Title = "Receiver1" };
            receiver.Color = Sender.Color;
            return PartialView("MessageReceiver", receiver);
        }
        public ActionResult Receive1(SenderModel Sender) { ... }
}