通过jQuery从post请求的部分视图中检索数据

时间:2012-03-29 17:57:29

标签: c# jquery asp.net-mvc partial-views

我有一个视图,根据用户输入动态更新 - 这是它的工作原理:

  • 使用填充了部分视图的控制器的初始数据呈现视图
  • 当点击某些内容时,我使用从控制器的ActionResult检索部分视图并用jQuery替换现有数据
  • 我需要来自控制器的主视图字符串,所以我再次调用控制器并检索字符串。

我想知道是否有办法通过局部视图获取我需要的字符串,而不是单独进行控制器调用。

初始数据:

<!-- This needs to change when the partial is replaced, but it's heavier html
     and I don't want to include it in the partial to minimize server calls/data -->
<div class="Location">&nbsp;</div>
<div class="myContainingDiv">
    <!-- This content gets updated -->
    @Html.Partial("_MyPartial");
</div>

部分视图

<div class="something">Model.something</div>

控制器方法(部分视图):

[HttpGet]
public ActionResult _MyPartial(string param1)
{
    MyModel model = new MyModel();
    // This is dynamic and what I need to get in my main view from the partial view
    model.something = "Hi";
    return PartialView(model);
}

控制器方法(返回所需的字符串):

public string GetHiString(string param1)
{
    return "Hi";
}

JavaScript(更新部分视图):

    $.post('/Home/_MyPartial', { 'param1': 'Hi' }, function (result) {
        $('.something').replaceWith(result);

        getOtherThing('Hi');
    });

JavaScript(getOtherThing):

    $.post('/Home/_GetHiString', { 'param1': 'Hi' }, function (result) {
        $('.Location').replaceWith(result);
    });
好吧,我认为这就是一切。

基本上我只想在每次通话时点击控制器。在局部视图中包含div不是一个理想的选择。

我第二次从主视图中点击控制器,以获取可以从第一种方法中的对象轻松创建的数据并发送到局部视图。

因此,除了在我的局部视图中包含<div class="Location">之外,还有一种方法可以将我需要的额外信息发送到局部视图并从我的主视图中动态检索(通过JavaScript)。或者,当我从JavaScript调用_MyPartial时,是否有办法返回其他数据?

这真的是我想要做的最后一次简化,我非常感谢你的帮助!

1 个答案:

答案 0 :(得分:4)

您可以修改部分视图_MyPartial,它的模型包含可以使用jQuery提取的隐藏内容:

部分视图

<div class="something">Model.something
    <input class="somethingElse" type="hidden" value="@(Model.somethingElse)" />
</div>

控制器方法(部分视图):

[HttpGet]
public ActionResult _MyPartial(string param1)
{
    MyModel model = new MyModel();
    // This is dynamic and what I need to get in my main view from the partial view
    model.something = "Hi";
    model.somethingElse = GetHiString(param1);
    return PartialView(model);
}

JavaScript(更新部分视图)

$.post('/Home/_MyPartial', { 'param1': 'Hi' }, function (result) {
    $('.something').replaceWith(result);

    $('.Location').html($('.somethingElse').val());

});