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>

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

感谢MR

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可以保持不变。

MVC5禁用基于另一个文本框值的文本框

1 个答案: