Обращение пользователя к нажатию клавиши 'Enter' на веб-сайте ASP.NET MVC

Я работаю над веб-сайтом ASP.NET MVC с несколькими кнопками отправки. то есть.

    <input type="submit" name="SubmitButton" value="Reset" />
    <input type="submit" name="SubmitButton" value="OK" />
    <input type="submit" name="SubmitButton" value="Back" />

Мне нужно разрешить пользователям быстро отправить форму, нажав клавишу 'Enter'. В стандарте HTML, как представляется, указывается, что первая кнопка отправки будет приниматься, если пользователь нажимает клавишу 'Enter'. Тем не менее, мне нужно сделать кнопку 2 (то есть кнопку "ОК" ) кнопкой по умолчанию, и по причинам, о которых я даже не хочу говорить, изменение порядка кнопок не является вариантом.

Я googled вокруг, и я нашел этот пост об использовании Page.Form.DefaultButton в ASP.NET, но это не работает с ASP.NET MVC.

Я также попробовал следующее решение javascript, хотя он работает в Chrome, но не работает в IE6

    $('body').keypress(function(e) {
       if (e.which === 13) {
          $("input[value='OK']").trigger('click');
       }
    });

Я могу подумать о некоторых действительно экстремальных решениях, таких как прохождение через каждый элемент управления в форме присоединения к ним вышеуказанной функции. Тем не менее, я не думаю, что очень аккуратное решение, поэтому мне интересно, есть ли у кого-то лучшее решение?

Ответы

Ответ 1

Во-первых, это неправильно:

<input type="submit" name="SubmitButton" value="Reset" />
<input type="submit" name="SubmitButton" value="OK" />
<input type="submit" name="SubmitButton" value="Back" />

Все три из них представляют кнопки отправки. A reset - вход типа = "reset". Получите это отсортировано. Во-вторых, я успешно реализовал что-то подобное, и он работает на IE6. Попробуйте следующее:

    function keypressHandler(e)
    {
        if(e.which == 13) {
            e.preventDefault(); //stops default action: submitting form
            $(this).blur();
            $('#SubmitButton').focus().click();//give your submit an ID
        }
    }

    $('#myForm').keypress(keypressHandler);

Часть focus() делает кнопку нажатой, когда пользователь нажимает кнопку ввода. Совершенно изящный.

Ответ 2

Используйте это.

$(function(){
    $('input').keydown(function(e){
        if (e.keyCode == 13) {
            $("input[value='OK']").focus().click();
            return false;
        }
    });
});

Ответ 3

У вас должна быть только одна кнопка отправки. Кнопка reset должна быть type="reset", а кнопка "Назад" должна быть type="button" следующим образом:

<input type="reset" name="ResetButton" value="Reset" />
<input type="submit" name="SubmitButton" value="OK" />
<input type="button" name="BackButton" value="Back" />

Затем reset и ОК будут работать так, как они должны, и вам нужно будет только обращаться с кнопкой "Назад" с помощью Javascript.

Изменить: Другой вариант - разместить кнопки reset и Back submit каждый в своих собственных формах внутри iframe. Затем они будут игнорироваться основной формой и не будут использоваться по умолчанию. Кроме того, это позволит вам указать их на различные действия сервера, если это необходимо, и не будет никакой зависимости от Javascript для действий кнопки.

Ответ 4

Поскольку вы используете jquery, если вы используете плагин hotkeys, вы можете сделать такой подход:

$(document).bind('keydown', 'return', function (evt){
    $.next("input[value='OK']").trigger("click");
    return false;
});

Ответ 5

Стандарт HTML, похоже, указывает, что первая кнопка отправки будет если пользователь нажимает кнопку 'Enter'ключ.

Нет, использование ключа ввода не определено, это приватное расширение, которое было добавлено при различных интерпретациях. В разных браузерах вы столкнетесь с различным поведением, и это может стать очень опасным, если вы начнете смешивать различные культурные или пользовательские условные обозначения о порядке слева и справа/справа налево.

Если в форме есть только одна кнопка, то все основные браузеры выполняют одно и то же поведение - они передают форму так, как если бы эта кнопка была нажата (кнопка buttonName = buttonValue включена в данные формы). Конечно, это не означает, что кнопки onclick handler будут запускаться - это поведение зависит от браузера.

Когда есть несколько кнопок, это полная стрельба дерьмом. Некоторые браузеры решают, что первая кнопка (и определение первого может меняться), большинство из них используют первый, упомянутый в дереве Html, в то время как другие пытаются использовать позицию экрана) было нажато и использовать его в представлении, в то время как другие браузеры (особенно некоторые версии IE) делают одинаково правильное предположение, что никакая конкретная кнопка не была нажата, и поэтому не включайте кнопкуName = buttonValue (остальная часть формы передается в порядке).

Ответ 6

Изменить порядок кнопок в источнике, но не визуально (т.е. использовать CSS для замены кнопок)?