级联DROPDOWNLIST与MVC5，阿贾克斯，C＃和MSSQL服务器 [英] Cascading DropdownList with MVC5, Ajax, C# and MSSQL Server
问题描述
我是很新的MVC从Windows Forms和3层架构来了。
I'm quite new to MVC coming from windows forms and 3 tier architecture.
我想使用级联dropdownlists（DDL）填充从数据库中找出。 即时通讯使用的MS SQL Server 2012，VS 2013
I'm trying to figure out using cascading dropdownlists (DDL) populated from database. Im using MS SQL Server 2012, VS 2013
目前我的用户调查问卷工作，用户可以从DDL多个答案中选择。依赖于某些选择我需要改变下一个问题的答案（再次DDL）。
Currently I'm work on user questionnaire which users can select from multiple answers from DDL. Depend on some selections I need to change answers (again DDL) on next question.
数据库：
表 DDLStacks ：
StackId | StackName
1 | Berry
2 | BerryColor
3 ....
表 DDLStackContents （SCID堆栈内容ID，索引的目的）
Table DDLStackContents (SCId Stack content id, indexing purpose)
SCId | StackId | GroupId | Key | Value
--------------------------------------
1 | 1 | Null | 1 | Grape
2 | 1 | Null | 2 | Avocado
3 | 1 | Null | 3 | Banana
4 | 2 | Null | 1 | Yellow
5 | 2 | Null | 2 | Green
6 | 2 | 1 | 3 | Red
7 | 2 | 1 | 4 | Orange
8...
步骤：
CREATE PROCEDURE [dbo].[spDLLSelect]
@p_StackName_in VARCHAR(20),
@p_GroupId_in Int = null
AS
BEGIN
SELECT [Key],Value FROM DDLStackContents
WHERE StackID IN (SELECT StackId FROM DDLStacks WHERE StackName = @p_StackName_in)
AND (GroupId = @p_GroupId_in OR @p_GroupId_in IS null)
Order By [Key]
END
正如你可以看到 DDLStacks 持有疑问， DDLStackContents 持有可能的答案这个问题。
As you can see DDLStacks hold questions, DDLStackContents holds possible answers for that question.
如果有一组我们可以选择只从该组，否则所有的答案特定堆栈的答案。
If there is a group we can select just the answers from that group otherwise all the answers for particular stack.
现在然后，我创建了一个ADO.NET实体数据模型来访问spDLLSelect。
Now then I have created an ADO.NET Entity Data model to access spDLLSelect.
现在我的水果模型是这样的
Now my fruit model is this
public class FruitModel
{
public IEnumerable<SelectListItem> BerryList { get; set; }
public IEnumerable<SelectListItem> BerryColorList { get; set; }
[Display(Name = "Berry")]
public byte? Berry { get; set; }
[Display(Name = "BerryColor")]
public byte? BerryColor { get; set; }
}
我的控制器是这样的，我需要选择颜色取决于浆果类。说，如果阿瓦克选择所有，如果香蕉刚组1。
My controller is this, I need to select color depend on type of berry. Say if Avacado select all, if Banana just group 1.
public class HomeController : Controller
{
public ActionResult Index()
{
CherryEntities db = new CherryEntities();
var model = new FruitModel();
model.BerryList = new SelectList(db.spDLLSelect("Berry", null), "Key", "Value");
//model.BerryColorList = new SelectList(db.spDLLSelect("BerryColor", null), "Key", "Value");
//model.BerryColorList = new SelectList(db.spDLLSelect("BerryColor", 1), "Key", "Value");
return View(model);
}
}
下面是我的看法：
@using (Html.BeginForm("Register2", "Account", FormMethod.Post, new { @class = "form-horizontal", role = "form" }))
{
<div class="form-group">
@Html.LabelFor(m => m.Berry, new { @class = "col-md-2 control-label" })
<div class="col-md-10" >
@Html.DropDownListFor(m => m.Berry, Model.BerryList, "Please Select")
</div>
</div>
<div class="form-group">
@Html.LabelFor(m => m.BerryColor, new { @class = "col-md-2 control-label" })
<div class="col-md-10">
@Html.DropDownListFor(m => m.BerryColor, Model.BerryColorList, "Please Select")
</div>
</div>
}
这是我的基本编码，我已经试过各种方法，使这个工作，我想看看阿贾克斯强类型code这样做的正确方法。
This is my basic coding, I have tried various methods to make this working, I'd like to see proper way of doing this with ajax STRONGLY Typed code.
可以利用的部分看法？有什么想法吗？
May be using partial views? any thoughts?
推荐答案
您已经得到了你的观点是强类型的一个模型。所有你需要做的是，在添加下拉列表（有关详细信息，请参见下面简称链接）更改事件。在变化的情况下，您可以加载值按选定的值，例如如果贝瑞被选中，您将需要获取相应的值贝瑞即葡萄，鳄梨。
You have already got a Model that your view is strongly typed with. All you need to do is, add a change event on dropdown list (for more information see referred link below). On change event, you can load the values as per selected value e.g. if Berry is selected you will need to fetch corresponding values for Berry i.e Grape, Avocado.
您可以加载使用JavaScript，当你有大量的数据是有用的值。或者你也可以preLOAD认为所有的数据，并在这种情况下，你只需要根据界面上的选择问题进行过滤的答案。
You can load values using JavaScript which is useful when you have large set of data. Or you can preload the view with all the data and in that case, you just need to filter the answers based on question selected on UI.
有关如何在实践中实现这一点帮助，请参阅<一href="http://www.c-sharpcorner.com/UploadFile/4d9083/creating-simple-cascading-dropdownlist-in-mvc-4-using-razor/"相对=nofollow>层叠的DropDownList在MVC 4 。您可以根据您的需要类似的例子。
For help on how to achieve this in practice please refer Cascading DropDownList In MVC 4. You can find similar example based on your needs.
这篇关于级联DROPDOWNLIST与MVC5，阿贾克斯，C＃和MSSQL服务器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
