Manejar al usuario presionando la tecla 'Entrar' en un sitio web ASP.NET MVC

Question

Estoy trabajando en un sitio web ASP.NET MVC que tiene varios botones de envío. es decir,

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

que necesito para permitir a los usuarios enviar rápidamente el formulario presionando la tecla 'Enter'. El estándar HTML parece especificar que se supondrá el primer botón de envío si un usuario presiona la tecla 'Entrar'. Sin embargo, necesito hacer que el botón 2 (es decir, el botón "OK") sea el botón predeterminado y por razones que no quiero mencionar, cambiar el orden de los botones no es una opción.

Busqué en Google y encontré this post sobre el uso de Page.Form.DefaultButton en ASP.NET pero esto no funciona con ASP.NET MVC.

También probé la siguiente solución javascript, mientras que funciona en Chrome, pero no funciona en IE6

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

puedo pensar en algunas soluciones realmente extremas, tales como ir a través de todos los controles individuales en forma de una adjunte la función anterior a ellos. Sin embargo, no creo que sea una solución muy ordenada, así que me pregunto si alguien ha obtenido una mejor solución.

Answer 1

En primer lugar, esto está mal:

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

Los tres de ellos son botones de envío. Un restablecimiento es una entrada de tipo = "reinicio". Conseguir eso ordenado En segundo lugar, he implementado con éxito algo así, y funciona en IE6. Pruebe esto:

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); 

La parte focus() hace que el botón parezca pulsarse cuando el usuario presiona enter. Muy ingenioso.

Answer 2

Cambiar el orden de los botones en el origen pero no visualmente (es decir, usar CSS para intercambiar los botones)?

Answer 3

Solo debe tener un botón de envío. El botón de reinicio debe ser type="reset" y el botón de atrás, probablemente debería ser type="button" así:

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

Entonces, Reset y OK solo funcionará de la manera que se supone que son y lo único que necesita para manejar el botón Atrás clic con Javascript

Editar: La otra opción sería colocar los botones Restablecer y Volver a enviar cada uno en sus propios formularios dentro de iframes. Entonces serían ignorados por el formulario principal y no serían botones predeterminados. Además, esto le permitiría apuntar a diferentes acciones del servidor si es necesario y no habría ninguna dependencia de Javascript para las acciones del botón.

Answer 4

Use esto.

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

Answer 5

Puesto que se utiliza jQuery, si utiliza hotkeys plugin, se puede hacer un tal enfoque:

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

Answer 6

estándar HTML parece indicar que el botón presentar primero será supuestos, si una usuario presione la tecla 'Intro' .

No, el uso de la tecla enter no está definido, es una extensión propia que se ha agregado bajo varias interpretaciones. Obtendrá un comportamiento diferente en diferentes navegadores (y puede ser muy peligroso cuando comience a mezclar en diferentes convenciones culturales o de interfaz de usuario sobre el ordenamiento de opciones de izquierda a derecha/derecha a izquierda).

Si solo hay 1 botón en el formulario, todos los navegadores mainstream siguen el mismo comportamiento: envían el formulario como si se hubiera presionado ese botón (se incluye un buttonName = buttonValue con los datos del formulario). Por supuesto, esto no significa que los botones onclick handler van a disparar, ese comportamiento es específico del navegador.

Cuando hay varios botones, es una completa cagada. Algunos navegadores deciden que el primer botón (y la definición de primero puede variar, la mayoría utiliza el primero mencionado en el árbol Html, mientras que otros intentan usar la posición de pantalla) y se utilizan en el envío, mientras que otros navegadores (notablemente algunas versiones de IE) hacen la suposición igualmente correcta de que no se presionó ningún botón específico, por lo que no incluyen un buttonName = buttonValue (el resto del formulario se envía bien).