Question

我在部分视图和控制器之间传递ViewModel时遇到问题。

我基本上想要的是让一个ViewModel使用Jquery通过不同的视图传递并动态更新。

我有一个使用Fuel UX Wizard的模态对话框。模态的代码位于名为“Container”的文件中，部分视图正在加载到容器中。

单击模态时，将调用changed.fu.wizard函数。

$('#uiWizard').on('changed.fu.wizard', function () {
        switch ($('#uiWizard').wizard('selectedItem').step) {
            case 1:
                console.log("step 1");

                $.ajax({
                    url: '@Url.Action("Step1", "Alert")',
                    datatype: "json",
                    type: "POST",
                    contentType: 'application/json; charset=utf-8',
                    beforeSend: function () {
                        $('#container1').html(loadingData());
                    },
                    success: function (data) {
                        $('#container1').html(data);
                    },
                    error: function (data) {
                        $('#container1').html(errorMessage(data));
                    },
                    complete: function () {

                    }
                });
                break;
        }
    });

控制器方法看起来简化如下：

[HttpPost]
public PartialViewResult Step1()
{
   TestView model = new TestView();
   return PartialView("Step1", model);
}

所以这基本上只是将Step1视图加载到容器视图中。

所以这是问题开始的时候。假设我旅馆Step.cshtml使用@model Application.ViewModels.TestView在顶部导入模型，并在Step1页面上使用Html帮助程序，例如复选框和Textareas。

当在向导上再次调用“Next”按钮时，将再次调用更改的方法。（在Container.cshtml文件中）我想将带有Jquery的第1步中的模型传递给带有ViewModel的控制器。

我希望控制器看起来像这样。从视图中获取模型并将其传递。

很容易就是将模型字符串化。这似乎在某些情况下有效，但我遇到的问题是模型没有更新。

$.ajax({
    url: '@Url.Action("Step2", "Alert")',
    datatype: "json",
    data: JSON.stringify('@Model'),
    type: "POST",
    contentType: 'application/json; charset=utf-8'
});

[HttpPost]
public PartialViewResult Step2(TestView model)
{
    return PartialView("Step2", model);
}

这变得凌乱，但希望这是可以理解的;）

修改

部分观点：我正在考虑的部分视图是我只想从控制器中检索ViewModel。某些部分视图可能会更改某些变量，而其他部分视图可能会将其传递出去。

所以在所有部分视图上我都有@model Application.ViewModels.TestView。我在Container页面上没有这个。（因为这里没有使用它）

然后我可以f.ex拥有这样的TextArea：

<section>
    <div class="textarea textarea-resizable">
        @Html.TextAreaFor(m => m.Text, new { @class = "form-control", rows = 15 })
    </div>
</section>

由于表单标记和其他所有内容都在容器视图中，因此基本上没有更多代码。

来自container.cshtml

        <div class="step-content">
            <form class="form-inline" id="fuelux-wizard" method="post">
                <div class="step-pane text-center active" id="step1">
                    <div id="container1"></div>
                </div>
                <div class="step-pane" id="step2">
                    <div id="container2"></div>
                </div>
                <div class="step-pane" id="step3">
                    <div id="container3"></div>
                </div>
                <div class="step-pane" id="step4">
                    <div id="container4"></div>
                </div>
            </form>
        </div>

并且div正在加载前面在成功方法中发布的更改方法。

            success: function (data) {
                $('#container1').html(data);
            },

Answer 1

public void OnGUI() { if (GUI.RepeatButton(new Rect(20, Screen.height - 150, Screen.width/10, Screen.width/10), boostButtonIcon)) { pressedButton = true; //do boost stuff } else { pressedButton = false; } }只会发回你的类的完全限定名，而不是模型的任何值（即使它确实有效，它也只会发布模型的原始值，因为剃刀代码被解析了服务器发送到客户端之前）。您需要序列化表单，因此ajax调用应该是

data: JSON.stringify('@Model')

请注意，$.ajax({ url: '@Url.Action("Step2", "Alert")', // datatype: "json", data: $('form').serialize(), // update this type: "POST", // contentType: 'application/json; charset=utf-8' });需要删除，并且contentType: 'application/json; charset=utf-8'指定控制器方法返回的数据 - 您似乎无法访问这些数据，因此它不会必要

另请注意，您还可以使用

手动构建表单数据

datatype

MVC - 使用Jquery在部分视图之间传递ViewModel

1 个答案: