Question

我有一个可行的解决方案，但是从下拉列表中选择了某个ID后，我不知道如何重新加载页面。我的列表是从数据库中填充的。选择它后，我可以看到它的ID和相应的数据。但是，屏幕上没有任何变化。

控制器类：

public ActionResult Index()
        {
            var model = test.getStuff();
            ViewBag.IDs = new SelectList(test.getID(), "", "ID");
            return View(model);
        }

[HttpPost]
        public ActionResult getDataBySelectedID(string selectedId)
        {
            var que = test.getHello(selectedId);
            return View(que);

        }

查看课程：

@Html.DropDownList("ID", ViewBag.IDs as SelectList) 

 $(document).ready(function () {
     $("#ID").on("change", function () {
            var selectedId = this.value;
            var url = "/Sample/getDataBySelectedID";

            $.ajax({
                method: "POST",
                dataType: "json",
                url: url,
                data: {
                    selectedId: selectedId
                }
            });
        });
     });

我如何能够使用所选值及其对应的数据重新加载页面？

任何帮助将不胜感激！

谢谢。

Answer 1

在getDataBySelectedID返回视图中，类似于Index，它是应用了过滤器的构造模型并返回View（model）

Answer 2

在您的情况下无需使用ajax

只要做

window.location.href =  "/Sample/getDataBySelectedID?selectedId=" +selectedId;

在您的onchange函数中，并在您的视图中将其返回为

[HttpGet]
        public ActionResult getDataBySelectedID(string selectedId)
        {
            var que = test.getHello(selectedId);
            return View("~/Index.cshtml",que);

        }

希望“ que”与您在Index函数上使用的模型相同

Answer 3

由于要在更改下拉列表选择后重新加载页面，因此应处理change事件以使用如下查询字符串进行重定向：

$("#ID").on("change", function () {
   var selectedId = $(this).val();

   window.location.href = '@Url.Action("getDataBySelectedID", "Sample")' + '?selectedId=' + selectedId;
});

请注意，window.location.href 使用HTTP GET方法，因此目标操作必须使用[HttpGet]而不是[HttpPost]：

[HttpGet]
public ActionResult getDataBySelectedID(string selectedId)
{
    var que = test.getHello(selectedId);
    // don't forget to repopulate ViewBag from SelectList here

    return View("Index", que); // return same page with different model contents
}

确保getHello()方法的返回类型与getStuff()方法相同，以避免传递与模型项相关的异常。

但是，如果您要提交表单并在之后再次显示，请改用$('form').submit()：

jQuery

$("#ID").on("change", function () {
   $('form').submit();
});

控制器

[HttpPost]
public ActionResult getDataBySelectedID(ViewModel model)
{
    // do something

    return View(model);
}

从下拉列表中选择一个值后，MVC重新加载页面

3 个答案: