0

我试图在我的应用程序中显示一个下拉列表,该下拉列表将用作“选项”列表。用户可以选择适用于其他地方的选项。只要用户停留在页面上,这些数据就会一直存在。

这是下拉列表:

public class ResultsOptions
{
    public string mStartOption { get; set; }

    public List<SelectListItem> mListOptions { get; set; }

    public ResultsOptions()
    {
        mListOptions = new List<SelectListItem>();
    }
}

然后以这种方式使用该对象:

[HttpGet]
public ActionResult SetResults(string _submitButton, string _option)
{
    mOptions.mListOptions = new List<SelectListItem>();

    foreach (var option in mListOptions)
    {
        if (!String.IsNullOrWhiteSpace(mResultOption))
        {
            if (option == mResultOption)
            {
                SelectListItem item = new SelectListItem
                {
                    Selected = true,
                    Text = option,
                    Value = option
                };

                mOptions.mStartOption = option;

                mOptions.mListOptions.Add(item);
            }
            else
            {
                SelectListItem item = new SelectListItem
                {
                    Text = option,
                    Value = option
                };

                mOptions.mListOptions.Add(item);
            }
        }
        else
        {
            mOptions.mStartOption = "";

            SelectListItem item = new SelectListItem
            {
                Text = option,
                Value = option
            };
            mOptions.mListOptions.Add(item);
        }
    }

    return PartialView(mOptions);
}

[HttpPost]
public JsonResult SetResults(ResultsOptions _options)
{
    if (!String.IsNullOrWhiteSpace(_options.mStartOption))
    {
        mResultOption = _options.mStartOption;

        mOptions.mStartOption = _options.mStartOption;

        var selected = mOptions.mListOptions.First(_x => _x.Value == _options.mStartOption);

        selected.Selected = true;
    }

    return Json(new { Message = "Option saved" } );
}

mListOptions是包含Standard和的字符串的静态列表Simple。正如您可能已经猜到的那样,我正在做一个局部视图,我在布局中呈现如下:

<div>
    <div class="float-left">
        @Html.ActionLink("Advanced Search", "AdvancedSearch", "Store")
        @Html.ActionLink("Browse Promo Packs", "PackSearch", "Store")
    </div>
    <div class="float-right">
         @{
             Html.RenderAction("SetResults", "Store");
         }
    </div>
    <div class="clear"></div>
</div>

最后是部分视图:

@model MyApp.ViewModels.ResultsOptions

<script type="text/javascript">
        $.post("/Store/SetResults/", $('#options').serialize(),
                function(data) {
                    $('#divMessage').html(data.Message);
                });
        </script>

@using (Html.BeginForm(null, null, FormMethod.Post, new { @id = "options"} ))
{
    @Html.DropDownListFor(_model => _model.mStartOption, Model.mListOptions, new { @class = "nullify" })
    <input type="submit" name="_submitButton" value="Set"/>
    <div id="divMessage">

    </div>
}

因此,基本上,我希望该下拉列表始终显示为可选列表。选择的值将在稍后使用,并且现在对显示几乎没有影响。

但是我有一个问题,当我点击“设置”按钮时,我的视图呈现部分视图,其余的被刷新。不是我想做的。谁能帮我吗?

编辑

我一直在按照建议处理一些 Json 结果,但我遇到了同样的问题:获得的结果消息是之后唯一显示的内容。

4

1 回答 1

0

这是因为您PartialViewPOST方法中返回 a 。如果您想保留整个视图并只更新部分 html,则需要使用 jQuery。

编辑:

您可以JsonResultPOST提供成功消息或其他内容的操作方法中返回 a:

return Json(new { Message = "Option saved" });

您必须使用 jquery 的 ajax 帖子提交您的表单。首先为您的提交按钮分配一个ID

看法

<input type="submit" id="submit-form" name="_submitButton" value="Set"/>

然后通过发布表单来处理脚本中的点击事件。

脚本

 $("#submit-form").click(function(ev) {
      ev.preventDefault();
      $.post("/Controller/SetResults/", $("#IdOfYourForm").serialize(),
           function(data) {
           $("#divMessage").html(data.Message);
      });
    });
于 2013-10-24T21:17:45.307 回答