jquery - Evento de fuego al presionar la tecla Intro para un cuadro de texto

asp.net event-handling

Question

Tengo el siguiente control de cuadro de texto asp.net.

<asp:TextBox ID="txtAdd" runat="server" />

Después de que el usuario escribe algo en este cuadro de texto y presiona la tecla ENTRAR , quiero ejecutar algún código del código subyacente.

¿Que debería hacer?

Usando jQuery capturé la tecla ENTER y activé un botón oculto

$(document).ready(function(){ 
   $(window).keydown(function(e){
      if(e.keyCode == 13) $(''#<% addbtn.ClientID %>''.click();
   }); 
});

Hay alguna forma mejor ?

Answer 1

Prueba esta opción

actualice esa parte de codificación en el evento Page_Load antes de capturar IsPostback

 TextBox1.Attributes.Add("onkeydown", "if(event.which || event.keyCode){if ((event.which == 13) || (event.keyCode == 13)) {document.getElementById(''ctl00_ContentPlaceHolder1_Button1'').click();return false;}} else {return true}; ");

Answer 2

mi solución jQuery powered está debajo :)

Elemento de texto:

<asp:TextBox ID="txtTextBox" ClientIDMode="Static" onkeypress="return EnterEvent(event);" runat="server"></asp:TextBox>
<asp:Button ID="btnSubmitButton" ClientIDMode="Static" OnClick="btnSubmitButton_Click" runat="server" Text="Submit Form" />

Javascript detrás

<script type="text/javascript" language="javascript">
    function fnCheckValue() {
        var myVal = $("#txtTextBox").val();
        if (myVal == "") {
            alert("Blank message");
            return false;
        }
        else {
            return true;
        }
    }

    function EnterEvent(e) {
        if (e.keyCode == 13) {
            if (fnCheckValue()) {
                $("#btnSubmitButton").trigger("click");
            } else {
                return false;
            }
        }
    }

    $("#btnSubmitButton").click(function () {
        return fnCheckValue();
    });
</script>

Answer 3

<asp:Panel ID="Panel2" runat="server" DefaultButton="bttxt">
    <telerik:RadNumericTextBox ID="txt" runat="server">
    </telerik:RadNumericTextBox>
    <asp:LinkButton ID="bttxt" runat="server" Style="display: none;" OnClick="bttxt_Click" />
</asp:Panel>

protected void txt_TextChanged(object sender, EventArgs e)
{
    //enter code here
}

Answer 4

1. Ajustar el cuadro de texto dentro de asp:Panel Etiquetas de asp:Panel

2. Oculte un botón que tiene un evento de clic que hace lo que desea hacer y otorgue al <asp:panel> un atributo DefaultButton con el ID del botón oculto.

<asp:Panel runat="server" DefaultButton="Button1">
   <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>    
   <asp:Button ID="Button1" runat="server" style="display:none" OnClick="Button1_Click" />
</asp:Panel>

Answer 5

La respuesta de ahaliav fox es correcta, sin embargo, hay un pequeño problema de codificación.
Cambio

<%=Button1.UniqueId%> 

a

<%=Button1.UniqueID%> 

es sensible a mayúsculas y minúsculas Propiedad Control.UniqueID

El error 14 ''System.Web.UI.WebControls.Button'' no contiene una definición para ''UniqueId'' y no se pudo encontrar ningún método de extensión ''UniqueId'' que aceptara un primer argumento de tipo ''System.Web.UI.WebControls.Button'' ( ¿Echas de menos una directiva de uso o una referencia de ensamblaje?)

Nb TextChanged evento TextChanged en AutoPostBack antes de buscar la respuesta, y aunque es casi correcta, no da el resultado deseado ni la pregunta formulada. Dispara al perder el foco en el Textbox y no al presionar la tecla de retorno.

Answer 6

Puede ajustar el cuadro de texto y el botón en un ASP: Panel y establecer la propiedad DefaultButton del Panel en el Id de su botón Enviar.

<asp:Panel ID="Panel1" runat="server" DefaultButton="SubmitButton">
    <asp:TextBox ID="TextBox1" runat="server" />
    <asp:Button ID="SubmitButton" runat="server" Text="Submit" OnClick="SubmitButton_Click" />
</asp:Panel>

Ahora, siempre que el foco esté dentro del Panel, el evento ''SubmitButton_Click'' se activará cuando se presione enter.

Answer 7

Mi 2c .. He usado javascript, pero encontré que hizo cosas que no eran del todo esperadas.

USE el atributo / propiedad DefaultButton del panel como lo sugieren muchas de las publicaciones anteriores. Es confiable (FÁCIL) y funciona en todos los buscadores en los que lo he probado.

Answer 8

ASPX:

<asp:TextBox ID="TextBox1" clientidmode="Static" runat="server" onkeypress="return EnterEvent(event)"></asp:TextBox>    
<asp:Button ID="Button1" runat="server" style="display:none" Text="Button" />

JS:

function EnterEvent(e) {
        if (e.keyCode == 13) {
            __doPostBack(''<%=Button1.UniqueID%>'', "");
        }
    }

CS:

protected void Button1_Click1(object sender, EventArgs e)
    {

    }

Answer 9

Intenta seguir: Aspx:

<asp:TextBox ID="TextBox1" clientidmode="Static" runat="server" onkeypress="EnterEvent(event, someMethod)"></asp:TextBox>    
<asp:Button ID="Button1" onclick="someMethod()" runat="server" Text="Button" />

JS:

function EnterEvent(e, callback) {
        if (e.keyCode == 13) {
            callback();
        }
    }

Answer 10

<input type="text" id="txtCode" name="name" class="text_cs">

y js:

<script type="text/javascript">
$(''.text_cs'').on(''change'', function () {
var pid = $(this).val();
console.log("Value text: " + pid);
});
</script>