javascript - MVC 4 基于复选框检查显示/隐藏文本框

Question

MVC 的新手——从来都不是前端 Web 开发人员(主要是后端)，所以我不太了解前端的良好设计。现在，我正在尝试在没有太多原始 WebForm 知识的情况下使用 MVC...也就是说，请给我一些关于如何处理以下内容的指示/链接/好的想法:

我有一个文本框字段，我想根据复选框显示/隐藏它。我的 View 中有这些字段 @using (Html.BeginForm()...

我应该在 javascript 或 Controller 操作中更改文本框上的属性吗？如果我使用 javascript，我很难获得 beginform 中的值，但如果我使用 Controller 操作，我不确定在我的 Controller 操作中如何传递/传递什么。

Answer 1

如果我想操作 DOM，我喜欢使用 jQuery。

这里是例子-

查看

@using (Html.BeginForm())
{
    @Html.CheckBoxFor(model => model.MyBooleanValue)
    <br />
    @Html.TextBoxFor(model => model.MyTextValue)
    <br />
    <input type="submit" value="Submit" />
}

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script>
    $(function () {
        $("#MyBooleanValue").click(function () {
            if ($(this).is(':checked')) {
                $("#MyTextValue").show();
            }
            else {
                $("#MyTextValue").hide();
            }
        });
    });
</script>

Controller

public class HomeController : Controller
{
    public ActionResult Index()
    {
        var model = new MyViewModel
        {
            MyBooleanValue = true
        };
        return View(model);
    }

    [HttpPost]
    public ActionResult Index(MyViewModel model)
    {
        if (model.MyBooleanValue)
        {
            string text = model.MyTextValue;
        }

        return View(model);
    }
}

型号

public class MyViewModel
{
    public bool MyBooleanValue { get; set; }
    public string MyTextValue { get; set; }
}

仅供引用:我建议在开始之前观看一些视频培训(免费类(class)在 ASP.NET MVC 5 Fundamentals )或阅读一两本书。否则，你会感到沮丧。