1

我有这个页面,我从下拉列表中选择一个项目,然后一个 ajax 调用将所选参数传递给我的控制器中的一个新操作,如下所示:

function select(e) {
    var unit = $("#unitList").data("kendoDropDownList").value();
    var url = '@Url.Content("~/Reports/UnitRunReport/")';

    $.ajax({
        url: url,
        data: { selectedUnit: unit },
        type: 'GET',
        dataType: 'json',
        success: function (data) {
            //
        },
        error: function () {
            // 
        }
    });
}

这是我的控制器:

public class ReportsController : BaseController
{
    public ReportsViewModel Model { get; set; }
    //
    // GET: /Reports/

    public ActionResult Index()
    {
        Model = new ReportsViewModel
                    {
                        Units = UnitClient.GetListOfUnits(true, "")
                    };

        return View(Model);
    }

    [HttpGet]
    public ActionResult UnitRunReport(string selectedUnit)
    {
        var unit = Convert.ToInt32(selectedUnit);
        Model = new ReportsViewModel
                    {
                        UnitRuns = RunClient.GetRunListForUnit(unit)
                    };

        return View(Model);
    }
}

我必须为两个操作(索引和 UnitRunReport)分开视图。调试时,它将正确的参数传递给 UnitRunReport 操作,并在return View(Model)语句中移动。有人可以解释为什么我没有从索引页面重定向到新的 UnitRunReport 视图吗?

4

5 回答 5

2

你在一个ajax调用中。ajax 调用不会重定向页面。

改为重定向到 get 方法:

window.location = "@Url.Content("~/Reports/UnitRunReport")?selectedunit=" + $("#unitList").data("kendoDropDownList").value();
于 2013-08-07T09:06:32.293 回答
1

您没有被重定向,因为您正在使用 ajax 进行呼叫。根据定义,这意味着页面不会更改。ajax 调用的结果(在本例中为 UnitRunReport 方法返回的 ActionResult)将返回到您提供给 jQuery 的成功委托的数据参数中。

您可以通过传入一个成功委托来解决此问题

success: function (data) {
        $("#dataElement").html(data);
    }

请注意,您正在从控制器方法返回 html。您可能希望返回一个 json 模型并使用诸如敲除之类的库将其绑定到您的页面。

如果您想实际重定向到页面而不是像当前那样进行 ajax 调用,那么您需要在用户更改下拉列表中的选择时设置 window.location 属性。这将导致整个页面重新加载并将 UnitRunReport 返回的视图呈现到新页面中。

于 2013-08-07T09:07:01.550 回答
1

首先,您正在发出一个 ajax 请求,该请求不会重定向页面,而只是从操作中读取数据。

其次,您正在请求 json 结果,它将为您提供 json 数据。

于 2013-08-07T09:07:09.073 回答
1

看起来您正在尝试取回 JSON 数据,而不是通常是 HTML 的视图。所以你的控制器应该如下所示。

public class HomeController : Controller
{
    public ReportsViewModel Model { get; set; }
    //
    // GET: /Reports/

    public ActionResult Index()
    {
        Model = new ReportsViewModel
        {
            Units = UnitClient.GetListOfUnits(true, "")
        };

        return View(Model);
    }

    [HttpGet]
    public ActionResult UnitRunReport(string selectedUnit)
    {
        var unit = Convert.ToInt32(selectedUnit);
        Model = new ReportsViewModel
        {
            UnitRuns = RunClient.GetRunListForUnit(unit)
        };

        return this.Json(Model, JsonRequestBehavior.AllowGet);
    }
}

您可以通过执行 console.log 来测试在您的 javascript 中返回的数据。另外,不要尝试 Url.Content,而是尝试 Url.Action,因为您的路线可能未正确设置,并且 url.action 将确保生成正确的路线。

function select(e) {
    var unit = $("#unitList").data("kendoDropDownList").value();
    var url = '@Url.Action("UnitRunReport", new { controller = "Home" })';
    $.ajax({
        url: url,
        data: { selectedUnit: unit },
        type: 'GET',
        dataType: 'json',
        success: function (data) {
            console.log(data);
            // do something with the data coming back
        },
        error: function () {
            // show some sort of message
        }
    });
}

要查看控制台,只需按 F12 即可让您的工具在您最喜欢的浏览器中弹出(我仍然是萤火虫的粉丝)。只需小心将任何使用 console.log 的东西部署到生产环境中,现在这通常并不重要,因为人们拥有较新的浏览器,但您仍然可能会遇到一两个会溜走并出现问题的浏览器。如果您想将代码保留在那里并将其投入生产,您可以启动一个脚本并将您的页面投入生产以覆盖 console.log

<script type="text/javascript">
    console = {
        log: function (s) {
            // empty method to override console
        }
    };
</script>

将其放入您的 site.master 并在开发过程中将其删除,您可以保留所有 console.logs,并且在投入生产时它们将停止显示。

于 2013-08-07T09:07:14.257 回答
0

因为您正在对 action 方法进行 Ajax 调用,所以视图将在此处的 data 参数中返回:function (data)

它不会重定向浏览器。

于 2013-08-07T09:06:12.800 回答