Question

我不知道我的标题是否有意义，但让我解释一下我想要做什么。

我的产品视图包含 ProductViewModel 和Html.BeginFrom(“AddToCart”, “Cart”)，用于将商品添加到购物车。

的ProductView：

@model Webshop.ViewModels.ProductViewModel

@{ Html.RenderPartial("_TextEditor", Model); }

@using (Html.BeginForm("AddToCart", "Cart"))
{
    @Html.HiddenFor(model => model.EditorImageUrl)
    <input type="number" id="quantity" name="quantity" value="@Model.Product.MinimumOrder" min="1" max="9999" />
    <input type="submit" value="Add to basket" />
}

在产品视图中，我还渲染了一个采用相同 ProductViewModel 的局部视图。在局部视图中，我有一个ckeditor绑定到我的ProductViewModel.EditorHtml属性，如@Html.TextAreaFor(model => model.EditorHtml)。我需要提交EditorHtml以在另一台服务器上生成图像。我通过使用Ajax.BeginForm来做到这一点。在我请求生成图像的GenerateImage Action中，我使用返回的ImageUrl设置ProductViewModel.EditorImageUrl。

PartialView TextEditor：

@model Webshop.ViewModels.ProductViewModel
<div id="designForm">
    <button type="button" id="modal-opener" class="editorInput"><img src="@Model.EditorImageUrl" alt="Texteditor"></button>

    <div id="dialog-text-editor">
        @using (Ajax.BeginForm("GenerateImage", "Image", new AjaxOptions { UpdateTargetId = "designForm", HttpMethod = "POST", OnSuccess = "closeDialogCallback" }))
        {
            <div>
                @Html.HiddenFor(model => model .ProductId)
                @Html.TextAreaFor(model  => model.EditorHtml)
            </div>
            <div>
                <button type="submit" title="Prewview" id="btnGeneratePreview">Preview</button>
                <button type="button" title="Close" id="btnCancel">Close</button>
            </div>

        }
    </div>
</div>

<script>
    $(document).ready(function () {
        // Texteditor Dialog
        $('#dialog-text-editor').dialog({
            autoOpen: false,
            resizable: false,
            draggable: true,
            modal: true,
            title: "TextEditor",
            width: 550,
            height: 550,
        });

        $('#EditorHtml').ckeditor();

        $("#modal-opener").click(function () {
            $("#dialog-text-editor").dialog("open");
        });

        $("#btnCancel").click(function () {
           $("#dialog-text-editor").dialog("close");
        });
    });

    function closeDialogCallback() {
        $("#dialog-text-editor").dialog("close");
    }
</script>

ImageController

[HttpPost]
[ValidateInput(false)]
public PartialViewResult GenerateImage(ProductViewModel viewModel)
{
    //In this method I set viewModel.EditorImageUrl
    CreateImage(viewModel);


    return PartialView("_TextEditor", viewModel);
}

这是我需要一些指导的地方。如何将我的ProductViewModel提交到我的CartController，其中所有属性都填充了PartialView中我的Ajax帖子的值？这些值始终为空。

如何在部分视图中更新ViewModel然后从View发布更新ViewModel？

0 个答案: