html - 将枚举类型绑定到 HTML5 范围控件

Question

我有一个枚举模型并想将其分配给范围控件（HTML5）。知道如何做到这一点。这是我的示例代码：

public enum SkillLevel
    {
        Beginner = 1,
        Intermediate,     
        Advanced,
        Professional
    }

我希望 SkillLevel 在我的视图中显示为滑块（type="range"）。

Answer 1

您可以通过提供所有枚举值（例如 1-4）来使这更容易开始

public class Enums
{
    public enum SkillLevel
    {
        Beginner = 1,
        Intermediate = 2,     
        Advanced = 3,
        Professional = 4
    }
}

然后你的最小值为 1，最大值为 4。

<input id="skillLevel" name="skillLevel" type="range" min="@(int)Enums.SkillLevel.Beginner" max="@(int)Enums.SkillLevel.Professional" step="1" />

然后，您的控制器可以接受您的表单输入类型SkillLevel，模型绑定将完成其余的工作（因此表单上的值 4 将出现在您的控制器中，就像SkillLevel.Professional在您的控制器中一样）

[HttpPost]
public ActionResult Index(Enums.SkillLevel skillLevel)
{

}