Question

我制作了一个类似以下设计的调查应用程序：

Survey: ID,Name.
Question: ID,SurveyId,QuestionText,QuestionTypeId.

QuerstionType can be (Text, CheckBox, DropDown,RadioButton).

在运行时为每个问题提供合适的HTML助手的最佳实践是什么。

当前，我正在使用传统的if else语句。

if(QuestionModel.QuestionTypeId==QuestionTypes.Text)
{
   @Html.editor()
}
else if(QuestionModel.QuestionTypeId==QuestionTypes.DropDown)
{
   @Html.DropDownList()
}   
else
{
   ...
}

以此类推。

我觉得我做错了什么，有什么办法可以自定义一个html帮助器，以根据问题类型采取不同的行动。

或者如果我可以将html helper附加到视图模型，然后像这样直接在视图中使用它：

Model.CustomDropdown.

Answer 1

您可以像这样创建自定义的HTML帮助器组件：

namespace System.Web.Mvc
{
    public static partial class HtmlHelperExtensions
    {

        public static MvcHtmlString CustomComponent(this HtmlHelper helper, string QuestionTypeId)
        {
            if (QuestionTypeId == "Text")
            {
                var inputTag = new TagBuilder("input");
                inputTag.MergeAttribute("type", "text");
                return MvcHtmlString.Create(inputTag.ToString());
            }
            else if (QuestionTypeId == "DropDown")
            {
                var dropDownTag = new TagBuilder("select");
                dropDownTag.MergeAttribute("type", "text");


                var option = new TagBuilder("option");
                option.InnerHtml = "Option 1";
                option.MergeAttribute("value", "option1");

                dropDownTag.InnerHtml += option.ToString();

                option = new TagBuilder("option");
                option.InnerHtml = "Option 2";
                option.MergeAttribute("value", "option2");

                dropDownTag.InnerHtml += option.ToString();

                return MvcHtmlString.Create(dropDownTag.ToString());
            }
            else
            {
                var inputTag = new TagBuilder("input");
                inputTag.MergeAttribute("type", "checkbox");
                return MvcHtmlString.Create(inputTag.ToString());
            }
        }
     }
}

在您的Razor代码中，您可以这样称呼它：

@Html.CustomComponent("Text")
@Html.CustomComponent("DropDown")
@Html.CustomComponent("Check")

在创建组件的情况下，必须在参数中传递自定义对象，而不是字符串。同样，在调用时，您将必须传递该自定义对象。喜欢：

public static MvcHtmlString CustomComponent(this HtmlHelper helper, QuestionModel questionModel)
        {
            if (questionModel.QuestionTypeId==QuestionTypes.Text)
            {
                var inputTag = new TagBuilder("input");
                inputTag.MergeAttribute("type", "text");
                return MvcHtmlString.Create(inputTag.ToString());
            }
        }

在剃刀中：

@Html.CustomComponent(questionModelObject)

如何自定义HTML Helper以根据问题类型进行操作？

1 个答案: