根據下拉列表項選擇更改MVC中的視圖

Question

我在View上有一個下拉列表：

<p>
@Html.DropDownList("Status", new List<SelectListItem>
    {
    new SelectListItem{ Text = "Show Active", Value = "0" },
    new SelectListItem{ Text = "Show Deleted", Value = "1" }},
    new
         {
             onchange = @"
        var form = document.forms[0];
        form.action='deletedDistricts';
        form.submit();"
         })

我指的是控制器動作：

[HttpPost]
    [ActionName("deletedDistricts")]
    public ActionResult deletedDistricts()
    {
        var d = hc.deletedDistricts.ToList();
        return View(d);
    }

但JavaScript給出的運行時錯誤為：

0x800a138f-JavaScript運行時錯誤：無法設置未定義或空引用的屬性“操作”

我不太擅長JavaScript。 知道為什么這段代碼會拋出Null引用嗎？

Answer 1

好吧，我看不到您會有與下拉菜單相關聯的表單，請確保將其包裝為：

@using(Html.BeginForm("deletedDistricts", controllerName, FormMethod.Post)) {
    // drowpdown here
}

並刪除

form.action='deletedDistricts';

conrollerName應該是控制器的名稱（字符串）。

Answer 2

讓我們再次閱讀您得到的錯誤：

0x800a138f-JavaScript運行時錯誤：無法設置未定義或空引用的屬性“操作”

好的，現在讓我們再次閱讀代碼，以查看嘗試在何處設置action屬性。 看起來好像正在這里發生：

form.action='deletedDistricts';

好的，因此似乎在此階段未定義form實例。 因此，您接下來要看的顯而易見的下一步是此form實例來自何處。 而且，您會發現自己的這一行代碼不會感到驚訝：

var form = document.forms[0];

不錯，您似乎正在嘗試檢索DOM中的第一個<form>元素。 但是你有這樣的元素嗎？ 您是否曾經使用過Html.BeginForm幫助器來呈現HTML表單？ 回答這些簡單的問題肯定會讓您走上正確的道路。 不要猶豫，檢查您在瀏覽器中生成的標記。 我相信這將幫助您找出缺失的部分。