MVC中下拉列表的动态填充

时间:2019-01-07 15:33:47

标签: c# asp.net-mvc asp.net-mvc-4 model-view-controller

好的,我有一个问题表,称为QuestionnaireTable。 该表具有以下属性:


QuestionnaireID    QuestionID    ChoiceType  ListOfAnswers QuestionLabel
---------------    ----------    ----------  ------------- -------------
AAA1               Quest1        enum        ListA         Pick a shape
AAA1               Quest2        string                    What is your name
AAA1               Quest3        enum        ListB         Pick a colour
AAA2               Quest1        enum        ListA         Pick a shape
AAA2               Quest4        number                    What is your age

我还有第二个表,名为QuestionMultiSelectTable 该表具有以下属性:


ListOfAnswersID Options
----------      ----------
ListA           Square
ListA           Triangle
ListA           Circle
ListA           Rectangle
ListB           Blue
ListB           Red

因此,我将QuestionnaireTable读入了Viewbag(放入ViewBag.QuestionsList中),并可以遍历每个项目以获取正确的问卷(例如,问卷“ AAA1”)。 但是,如果choicetype是一个“枚举”,那么我需要使用QuestionMultiSelectTable表中具有相同ListOfAnswersID

@foreach (var QuestionItem in ViewBag.QuestionsList)
{
    if (QuestionItem.OptionsType == "enum")
    {
        <div class="form-group">
            <div class="control-label col-md-3">
                @QuestionItem.QuestionLabel:
            <div>
            <div class="col-md-9">
                @Html.DropDownList((string)QuestionItem.QuestionID, Enumerable.Empty<SelectListItem>(),
                         "Select answer",
                         new { @class = "form-control" })
            </div>
        </div>
        }
        else
        {
            <div class="form-group">
                <div class="control-label col-md-3">
                    @QuestionItem.QuestionLabel:
                </div>
                <div class="col-md-9">
                    @Html.TextBox((string)QuestionItem.QuestionLabel, "0", new { @class = "form-control" })
                </div>
            </div>
        }
    }

@foreach (var QuestionItem in ViewBag.QuestionsList) { if (QuestionItem.OptionsType == "enum") { <div class="form-group"> <div class="control-label col-md-3"> @QuestionItem.QuestionLabel: <div> <div class="col-md-9"> @Html.DropDownList((string)QuestionItem.QuestionID, Enumerable.Empty<SelectListItem>(), "Select answer", new { @class = "form-control" }) </div> </div> } else { <div class="form-group"> <div class="control-label col-md-3"> @QuestionItem.QuestionLabel: </div> <div class="col-md-9"> @Html.TextBox((string)QuestionItem.QuestionLabel, "0", new { @class = "form-control" }) </div> </div> } }

的唯一列表填充一个下拉列表

现在,我正努力了解如何使用QuestionMultiSelectTable表的正确答案列表填充此下拉列表。 问卷,问题和可能答案的列表会不断更改,添加和删除。

那么关于在MVC中执行最佳方法而不必为页面创建复杂的主类的任何建议? (请注意,这只是页面中的一小部分,因此,除非别无选择,否则不要想创建自定义类)

理想情况下,我会像在构建/正在构建每个下拉列表时可以使用“ ListOfAnswersID”调用的单个动作那样,然后将其填充。 但是我努力在任何地方都找不到示例。

1 个答案:

答案 0 :(得分:0)

https://dotnetfiddle.net/Kpin7x

创建表格-我添加了一个ID

CREATE TABLE [AHCCCS\KXBlau].[QuestionMultiSelect](
    [Id] [int] IDENTITY(1,1) NOT NULL,
    [ListOfAnswersID] [char](5) NOT NULL,
    [Options] [varchar](20) NULL,
 CONSTRAINT [PK_QuestionMultiSelect] PRIMARY KEY CLUSTERED 
(
    [Id] ASC
)WITH (PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON, ALLOW_PAGE_LOCKS = ON) ON [PRIMARY]
) ON [PRIMARY]

CREATE TABLE [AHCCCS\KXBlau].[Questionnaire](
    [Id] [int] IDENTITY(1,1) NOT NULL,
    [QuestionnaireID] [char](4) NULL,
    [QuestionID] [char](6) NULL,
    [ChoiceType] [varchar](6) NULL,
    [ListOfAnswers] [char](5) NULL,
    [QuestionLabel] [varchar](20) NULL,
 CONSTRAINT [PK_Questionnaire] PRIMARY KEY CLUSTERED 
(
    [Id] ASC
)WITH (PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON, ALLOW_PAGE_LOCKS = ON) ON [PRIMARY]
) ON [PRIMARY]

GO

控制器/视图模型

public class BigMBViewModel
{
    public IList<SelectListItem> QuestionMultiSelectList { get; set; }
}

public class HomeController : Controller
{
    [HttpPost]
    public ActionResult Tut141(FormCollection formCollection)
    {
        ArrayList results = new ArrayList();
        for (int i = 0; i < formCollection.Count; i++)
        {
            if (formCollection[i].Contains("List"))
            {
                results.Add(formCollection[i]);
            }
        }

        return View();
    }

    public ActionResult Tut141()
    {
        //I am using entity framework.  You can use plain ADO
        //read the the QuestionnaireTable into the Viewbag (into ViewBag.QuestionsList
        using (SMARTEntities2 entity = new SMARTEntities2())
        {
            ViewBag.QuestionsList = entity.Questionnaires.ToList();
        }

        BigMBViewModel bmbViewModel = new BigMBViewModel { QuestionMultiSelectList = new List<SelectListItem>() };

        using (SMARTEntities2 entity = new SMARTEntities2())
        {
            entity.QuestionMultiSelects.ToList().ForEach(r => bmbViewModel.QuestionMultiSelectList.Add(
                new SelectListItem { Text = r.Options, Value = r.ListOfAnswersID + "-" + r.Id.ToString() }));            }

        return View(bmbViewModel);
    }

查看

@model Testy20161006.Controllers.BigMBViewModel
@{
    Layout = null;
}
<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Tut141</title>
</head>
<body>
    @using (Html.BeginForm())
    {
        int index = 0;
        foreach (var QuestionItem in ViewBag.QuestionsList)
        {
            //fixed the next line
            //if (QuestionItem.OptionsType == "enum")
            if (QuestionItem.ChoiceType == "enum")
            {
                ++index;
                <div class="form-group">
                    <div class="control-label col-md-3">
                        @QuestionItem.QuestionLabel:
                        @*fixed the next end div to be an end div instead of a begin div*@
                    </div>
                    <div class="col-md-9">
@{
                        var listOfAnswers = QuestionItem.ListOfAnswers;
                        var q = Model.QuestionMultiSelectList.ToList().Where(r => r.Value.Contains(listOfAnswers));
                        var theList = new
                        SelectList(Model.QuestionMultiSelectList, "Value", "Text");
                        }
                        @Html.DropDownList("theList" + index, q,
                            new { @id = "getThisValue", @class = "form-control" })

                    </div>
                </div>
            }
            else
            {
                <div class="form-group">
                    <div class="control-label col-md-3">
                        @QuestionItem.QuestionLabel:
                    </div>
                    <div class="col-md-9">
                        @Html.TextBox((string)QuestionItem.QuestionLabel, "0", new { @class = "form-control" })
                    </div>
                </div>
            }
        }
        <input type="submit" value="submit" />
    }
</body>
</html>