mvc radiobuttonfor в редакторе шаблонной клавиатуры навигация не задает модель

Контекст: Модель, генерирующая некоторые группы RadioButtonFor в качестве входных данных для ответа на вопросы.

Что происходит:

Случай 1. При щелчке мышью на опции радио дисплей выглядит правильно. Когда [HttpPost] ActionResult(модель) для страницы запускается, Model.Answer дает правильное значение. Что хорошо и желательно.

Случай 2. При перемещении с помощью клавиатуры в группу радиостанций и выборе одной из них с помощью клавиш со стрелками дисплей выглядит правильно. Но когда срабатывает [HttpPost] ActionResult(модель), значение Model.Answer не меняется по сравнению с тем, которое было загружено при загрузке страницы.

Вот код, который делает группу радио:

@model NexusPWI.ViewModels.Wizard.QuestionModel
@* Dynamically generate and model bind controls for QuestionModel *@
@{
    <div class="row d-contents">
        <div class="form-group">
            <div class="question">
                <div class="col-lg-2 d-contents">
                    <div class="btn-group btn-toggle group-sm d-contents" data-toggle="buttons">
                        <label class="btn QuestionRadio btn-default @(Model.Answer == YesNoNAOptions.Yes ? "active" : "")" for="@Model.Answer">
                            @YesNoNAOptions.Yes.ToString().ToUpper()
                            @Html.RadioButtonFor(Model => Model.Answer, YesNoNAOptions.Yes, new { @onfocus = "radiofocus(event)", @onblur = "radioblur(event)" })
                        </label>
                        <label class="btn QuestionRadio btn-default @(Model.Answer == YesNoNAOptions.No ? "active" : "")" for="@Model.Answer">
                            @YesNoNAOptions.No.ToString().ToUpper()
                            @Html.RadioButtonFor(Model => Model.Answer, YesNoNAOptions.No, new { @onfocus = "radiofocus(event)", @onblur = "radioblur(event)" })
                        </label>
                        @if (!Model.NaInvalid)
                        {
                            <label class="btn QuestionRadio btn-default @(Model.Answer == YesNoNAOptions.NA ? "active" : "")" for="@Model.Answer">
                                N/A
                                @Html.RadioButtonFor(Model => Model.Answer, YesNoNAOptions.NA, new { @onfocus = "radiofocus(event)", @onblur = "radioblur(event)" })
                            </label>
                        }
                    </div>
                </div>
                <div class="col-lg-9 d-contents">
                    <div class="row">
                        <p>
                            <strong>@Model.Question</strong>
                        </p>
                    </div>

                    @Html.HiddenFor(x => Model.Question_IdentityMarker, new { @class = "Question_IdentityMarker" })

                </div>
            </div>
        </div>
    </div>

}

Вот пример сгенерированного HTML:

<div class="form-group">
    <div class="question">
        <div class="col-lg-2 d-contents">
            <div class="btn-group btn-toggle group-sm d-contents" data-toggle="buttons">
                <label class="btn QuestionRadio btn-default " for="No">
                    YES
                    <input data-val="true" data-val-required="The Answer field is required." id="Questions_0__Answer" name="Questions[0].Answer" onblur="radioblur(event)" onfocus="radiofocus(event)" value="Yes" type="radio">
                </label>
                <label class="btn QuestionRadio btn-default active" for="No">
                    NO
                    <input checked="checked" id="Questions_0__Answer" name="Questions[0].Answer" onblur="radioblur(event)" onfocus="radiofocus(event)" value="No" type="radio">
                </label>
                    <label class="btn QuestionRadio btn-default " for="No">
                        N/A
                        <input id="Questions_0__Answer" name="Questions[0].Answer" onblur="radioblur(event)" onfocus="radiofocus(event)" value="NA" type="radio">
                    </label>
            </div>
        </div>
        <div class="col-lg-9 d-contents">
            <div class="row">
                <p>
                    <strong>Do you charge sales tax?</strong>
                </p>
            </div>

            <input class="Question_IdentityMarker" id="Questions_0__Question_IdentityMarker" name="Questions[0].Question_IdentityMarker" value="CUSTOMERSALESTAX" type="hidden">
         </div>
    </div>
</div>

РЕДАКТИРОВАТЬ Добавление onFocus & onBlur по запросу: onFocus & onBlur - это подсветка CSS для навигации по клавиатуре, чтобы сделать ее более понятной для пользователя, где они находятся на странице.

function radiofocus(event) {
    // Get event object  if using Internet Explorer 
    var e = event || window.event;
     // Check the object for W3C DOM event object, if not use IE event object to update the class of the parent element 
    if (e.target) {
        var addClass = focusClass(e.target.parentNode.parentNode.parentNode.parentNode.parentNode.className, "r");
        e.target.parentNode.parentNode.parentNode.parentNode.parentNode.className = addClass;
    } else {
        var addClass = focusClass(e.srcElement.parentNode.parentNode.parentNode.parentNode.parentNode.className, "r");
        e.srcElement.parentNode.parentNode.parentNode.parentNode.parentNode.className = addClass;
    }
};
function radioblur(event) {
    // Get event object  if using Internet Explorer 
    var e = event || window.event;
    var removeClass = focusClass("", "r").trim();
    // Check the object for W3C DOM event object, if not use IE event object to update the class of the parent element 
    if (e.target) {
        e.target.parentNode.parentNode.parentNode.parentNode.parentNode.className = e.target.parentNode.parentNode.parentNode.parentNode.parentNode.className.replace(removeClass, "");
    } else {
        e.srcElement.parentNode.parentNode.parentNode.parentNode.parentNode.className = e.srcElement.parentNode.parentNode.parentNode.parentNode.parentNode.className.replace(removeClass, "");
    }
};

Почему изменения в навигации не возвращаются к контроллеру?

Что-нибудь добавить, чтобы сделать это понятнее?

Примечание: по какой-то причине до того, как значение выбрано в группе радио, навигация по вкладке клавиатуры останавливается для каждого ответа радио на вопрос.

0 ответов

Другие вопросы по тегам