web-dev-qa-db-fra.com

Appuyez sur la touche Entrée pour déclencher un événement dans une zone de texte.

J'ai le contrôle de zone de texte asp.net suivant.

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

Après que l'utilisateur ait écrit quelque chose dans cette zone de texte et appuyé sur ENTER clé, je veux exécuter du code de codebehind.

Que devrais-je faire?

En utilisant jQuery j'ai capturé ENTER clé et déclenché un événement bouton caché

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

Y a-t-il une meilleure façon ?

jqueryasp.netevent-handling
33
ALAN

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

    }
31
ahaliav fox

  1. Envelopper la zone de texte à l'intérieur asp:Panel Mots clés

  2. Cacher un bouton qui a un événement de clic qui fait ce que vous voulez et donnez le <asp:panel> a DefaultButton Attribut avec l'ID du bouton caché.

<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>
110
Jimmy Mattsson

Vous pouvez envelopper la zone de texte et le bouton dans un ASP: Panel et définir la propriété DefaultButton du Panel sur l'ID de votre bouton Soumettre.

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

Désormais, chaque fois que le panneau est actif, l'événement 'SubmitButton_Click' se déclenche lorsque vous appuyez sur Entrée.

11
wblanks

la réponse de ahaliav fox est correcte, mais il y a un petit problème de codage.
Changement

<%=Button1.UniqueId%>

à

<%=Button1.UniqueID%>

c'est sensible à la casse. propriété Control.UniqueID

Erreur 14 'System.Web.UI.WebControls.Button' ne contient pas de définition pour 'UniqueId' et aucune méthode d'extension 'UniqueId' n'accepte un premier argument de type 'System.Web.UI.WebControls.Button' ( il vous manque une directive using ou une référence Assembly?)

N.b. J'ai moi-même essayé l'événement TextChanged le AutoPostBack avant de chercher la réponse, et bien que ce soit presque exact, cela ne donne pas le résultat souhaité ni la question posée. Il se déclenche en perdant le focus sur le Textbox et non en appuyant sur la touche Retour.

5
Matthew Radford

ma solution basée sur jQuery est ci-dessous :)

élément de texte:

<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 derrière:

<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>
2
Sedat Kumcu

Essayez de suivre: 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();
        }
    }
1
Vadym Klyachyn
<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
}
1
Asanka Namal
<input type="text" id="txtCode" name="name" class="text_cs">

et js:

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

Essayez cette option.

met à jour cette partie de codage dans l'événement Page_Load avant d'attraper 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}; ");
0
Anwar Sadat