MVC5基于另一个textbox值禁用textbox

Question

我有一个能够创建，编辑和删除记录的mvc5项目。有3个文本框。

根据textBox1中的值，我想禁用TextBox3和4；

if frequency.Value='Weekly' 
{
   Disable TextBox_BiWeekly 
   Enable TextBox3_Weekly
}
if frequency.Value='BiWeekly'
{
   Disable TextBox3_Weekly
   Enable TextBox4_BiWeekly
}

这是Edit.cshtml中代码的一部分

    <div class="form-group">
                @Html.LabelFor(model => model.frequency, htmlAttributes: new { @class = ".col-form-label col-md-2" })
                <div class="col-md-10">
                    <div class="form-check">
                        @Html.EditorFor(model =>model.frequency)
                        @Html.ValidationMessageFor(model =>model.frequency, "", new { @class = "text-danger" })
                    </div>
                </div>
            </div>
<div class="form-group">
                @Html.LabelFor(model => model.Weekly, htmlAttributes: new { @class = ".col-form-label col-md-2" })
                <div class="col-md-10">
                    <div class="form-check">
                        @Html.EditorFor(model =>model.Weekly)
                        @Html.ValidationMessageFor(model =>model.Weekly, "", new { @class = "text-danger" })
                    </div>
                </div>
            </div>
<div class="form-group">
                @Html.LabelFor(model => model.BiWeekly, htmlAttributes: new { @class = ".col-form-label col-md-2" })
                <div class="col-md-10">
                    <div class="form-check">
                        @Html.EditorFor(model =>model.BiWeekly)
                        @Html.ValidationMessageFor(model =>model.BiWeekly, "", new { @class = "text-danger" })
                    </div>
                </div>
            </div>

我不确定如何禁用或启用文本框

谢谢先生

Answer 1

最好的方法可能是在JavaScript中，这样文本框就可以根据您的频率输入的值动态地启用/禁用。

类似于：

$(function() {
    EnableDisableFrequency();
    $('#Frequency').change(function() {
        EnableDisableFrequency();    
    });
});
function EnableDisableFrequency() {
    if ($('#Frequency').val() === "Weekly") {
        $('#BiWeekly').prop('disabled', true);
        $('#Weekly').prop('disabled', false);
    } else if ($('#Frequency').val() === "BiWeekly") {
        $('#BiWeekly').prop('disabled', false);
        $('#Weekly').prop('disabled', true);    
    }
}

我的JavaScript有点生疏了，但我很确定这应该可以用。然而，我同意Stephen Muecke的观点，你的频率输入应该是一个下拉列表。

@Html.DropDownListFor(m => m.Frequency, Model.FrequencyList)

只需在ViewModel中将FrequencyList定义为一个包含所有可能值的列表，我假设它就是Weekly和BiWeekly

FrequencyList = new List<SelectListItem>
            {
                new SelectListItem
                {
                    Text = "Weekly",
                    Value = "Weekly"
                },
                new SelectListItem
                {
                    Text = "BiWeekly",
                    Value = "BiWeekly"
                }
            };

JavaScript可以保持不变。