选中(或未选中)复选框时更改ViewModel

Question

伙计们！

我有这个ViewModel：

public class ItemViewModel {
    [Display(Name="Has serie number?")]
    public bool HasSerieNumber { get; set; }
    public string SerieNumber { get; set; }
}

我有这样的视图：

@Html.LabelFor(item => item.HasSerieNumber);
@Html.CheckBoxFor(item => item.HasSerieNumber);

@Html.TextBoxFor(item => item.SerieNumber);

下面是JS代码：

$('#HasSerieNumber').click(function() {
    if ($(this).is(':checked')) {
        $('#SerieNumber').show();   
    } else {
        $('#SerieNumber').hide();
    }
});

嗯，当我选中HasSerieNumber复选框时，会显示SerieNumber文本框。当我在视图中选中项目时，有没有办法触发/更改HasSerieNumber属性？这个想法是:当我选中复选框时，属性值将会改变，我可以通过这个属性来控制文本框的可见性。

谢谢!

Answer 1

因为HasSerieNumber属性被绑定到checkbox，所以您的代码已经做到了这一点。选中复选框时，HasSerieNumber将作为true发送到相应的控制器操作，如果未选中，则为false。当单击复选框时，您还可以有效地切换相应文本框的可见性。

因此，只需将其封装在一个表单中：

@using (Html.BeginForm("SomeAction", "SomeController"))
{

    @Html.LabelFor(item => item.HasSerieNumber)
    @Html.CheckBoxFor(item => item.HasSerieNumber)

    @Html.TextBoxFor(item => item.SerieNumber)

    <button type="submit">OK</button>
}

当表单提交给下面的控制器操作时：

[HttpPost]
public ActionResult SomeAction(ItemViewModel model)
{
    ...
}

多亏了默认的模型绑定器，模型将从请求值正确绑定- HasSerieNumber和SerieNumber属性将包含这些值。