MVC5 отключить текстовое поле на основе другого значения текстового поля - PullRequest
Новая
       10

MVC5 отключить текстовое поле на основе другого значения текстового поля

0 голосов
/ 30 августа 2018

У меня есть проект 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

1 Ответ

0 голосов
/ 04 сентября 2018

Вероятно, лучший способ сделать это в 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 немного ржавый, но я уверен, что это должно сработать. Однако я согласен со Стивеном Мюке, что ваш частотный ввод должен быть выпадающим списком. 

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

Просто определите FrequencyList в вашей ViewModel как список, который содержит все потенциальные значения, которые, как я полагаю, составляют только Еженедельно и раз в две недели 

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

JavaScript может остаться прежним.

...