在ASP.NET MVC3中使用級聯ListBox的Ajax回發

首先，我是ASP.NET MVC noob。這是我使用ASP.NET MVC的第一個項目，所以我仍然在學習。我的背景主要是WPF和XAML在過去兩年。在ASP.NET MVC3中使用級聯ListBox的Ajax回發

所以這裏是我的問題：我有三個級聯ListBoxes。第二個列表框數據依賴於第一個，第三個依賴於第二個。我想使用Ajax刷新來填充每個列表中的數據。

這裏是我的Index.cshtml：

@model WebApplication.Models.DevelopmentModel 

<!DOCTYPE html> 

<html> 
<head> 
    <title>Dashboard</title> 
    <script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script> 
</head> 

<body class="body" scroll="auto"> 

    <div class="page"> 
      <div class="content"> 

       <div id="lists"> 

        @Html.Partial("DevelopmentListsView", Model) 

       </div> 
      </div> 
    </div> 

</body> 
</html>

我DevelopmentListsView.cshtml看起來是這樣的：

@model WebApplication.Models.DevelopmentModel 

@using (Ajax.BeginForm("Index", "Development", new AjaxOptions() { UpdateTargetId = "lists" })) 
{ 
    @Html.ListBoxFor(m => m.SelectedApplication, new SelectList(ViewBag.Applications), new { onchange = "this.form.submit();" }) 
    @Html.ListBoxFor(m => m.SelectedVersion, new SelectList(ViewBag.Versions), new { onchange = "this.form.submit();" }) 
    @Html.ListBoxFor(m => m.SelectedFlow, new SelectList(ViewBag.Flows)) 
}

我的模型看起來像：

public class DevelopmentModel 
{ 
    public string SelectedApplication { get; set; } 
    public string SelectedVersion { get; set; } 
    public string SelectedFlow { get; set; } 
}

我的控制器看起來像這個：

public class DevelopmentController : Controller 
{ 
    // 
    // GET: /Development/ 

    public ActionResult Index() 
    { 
     FillViewBag(); 

     return View(new DevelopmentModel()); 
    } 


    [AcceptVerbs(HttpVerbs.Post)] 
    public ActionResult Index(DevelopmentModel model) 
    { 
     FillViewBag(model); 

     return PartialView("DevelopmentListsView", model); 
    } 


    private void FillViewBag(DevelopmentModel model = null) 
    { 
     //Magic to get all three lists dependent on the available data in the model: 

     ViewBag.Applications = applications; 
     ViewBag.Versions = versions; 
     ViewBag.Flows = flows; 
    } 

}

現在，我想使用Ajax回調來檢索數據，所以它不會每次都刷新，但是當我單擊其中一個Listbox項時，頁面將只顯示之後的DevelopmentListsView視圖，而不是刷新任何內容..

有人能告訴我我做錯了什麼嗎？

感謝您的期待！

來源

2011-08-08 Arcturus

想通了我自己的問題：

我有兩個錯誤：

我錯過了jQuery腳本包括在Index.cshtml：

<script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script> 
<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>

，我用了錯誤的提交（它應該是jQuery提交）：

$(this.form).submit()

提交放置在我的模型

@model WebApplication.Models.DevelopmentModel 

@using (Ajax.BeginForm("Index", "Development", new AjaxOptions() { UpdateTargetId = "lists" })) 
{ 
    @Html.ListBoxFor(m => m.SelectedApplication, new SelectList(ViewBag.Applications), new { onchange = "$(this.form).submit()" }) 
    @Html.ListBoxFor(m => m.SelectedVersion, new SelectList(ViewBag.Versions), new { onchange = "$(this.form).submit()" }) 
    @Html.ListBoxFor(m => m.SelectedFlow, new SelectList(ViewBag.Flows)) 
}

希望這有助於某人某天;）。

來源

2011-08-08 12:12:14 Arcturus

在ASP.NET MVC3中使用級聯ListBox的Ajax回發

回答

相關問題