Comment puis-je déclencher un événement Click Button lorsque la touche Entrée est enfoncée en fonction de la zone de texte mise en évidence?

J'ai un formulaire avec plusieurs boutons de soumission. Je souhaite que les événements de clic du bouton se déclenchent lorsque vous appuyez sur Entrée en fonction des zones de texte en cours de mise au point. Je suis en mesure de spécifier un bouton en utilisant le code ci-dessous en ajoutant l'événement onkeydown au corps de la page et la vérification de la codeTouche de EnterComment puis-je déclencher un événement Click Button lorsque la touche Entrée est enfoncée en fonction de la zone de texte mise en évidence?

<body onkeydown="if(event.keyCode==13){document.getElementById('btnSearch').click();}"> 
... 
</body>

Je suppose que ce code peut être modifié ou appeler une fonction pour effectuer une conditionnelle voir si txtSearch ou txtSubmit a le focus et spécifier btnSearch ou btnSubmit en conséquence, mais je n'ai pas l'expérience du javascript.

Toute aide/conseil serait formidable!

Source

2010-07-14 Starwfanatic

J'ai finalement obtenu les résultats que j'avais après. J'avais besoin d'utiliser une fonction pour arrêter le bouton 'enter' par défaut de tir et une autre fonction pour déclencher l'événement de clic du bouton correct. Voici le script utilisé:

<script type="text/javascript"> 
function KeyDownEventHandler(e, box) { 
    var charCode = (e.which) ? e.which : event.keyCode 
    if (charCode == 13) 
     document.getElementById(box).click(); 
} 

function DisableEnterKey() { 
    if (event.keyCode == 13) { 
     return false; 
    } 
    else { 
     return true; 
    } 
} 
</script>

J'ai appelé la fonction DisableEnterKey de l'événement onkeydown du corps et l'KeyDownEventHandler de l'événement onkeydown de la zone de texte:

<body onkeydown="return DisableEnterKey()"> 
... 
<input id="txtSearch" type="text" runat="server" onkeydown="KeyDownEventHandler(event, 'btnSearch');" /> 
... 
<input id="txtAddEor" type="text" runat="server" onkeydown="KeyDownEventHandler(event, 'btnAddEor');" /> 
... 
<input id="txtCategory" type="text" runat="server" onkeydown="KeyDownEventHandler(event, 'btnAddEor');" />

Source

2010-07-14 21:59:27 Starwfanatic

Le premier problème peut être une faute de frappe mais vous devez ajouter une seule citation et supprimer le point-virgule dans votre code ci-dessus.

<body onkeydown="if(event.keyCode==13){document.getElementById('btnSearch').click();}"> 
... 
</body>

Mais je ne pense pas que la capture d'un événement de clé globale est la meilleure solution. Je voudrais ajouter l'onkeydown aux contrôles de formulaire réels afin que vous ne soyez pas simplement ramasser chaque entrée. En faisant cela, vous pouvez spécifier dans la méthode de gestionnaire d'événement un paramètre qui indique quelle zone de texte est utilisée.

<input type="text" onkeydown="KeyDownEventHandler(event, 1);" />

Ensuite, vous écrivez juste la méthode pour gérer tous les événements de capture clés:

function KeyDownEventHandler(e, box) 
{ 
    var charCode = (e.which) ? e.which : event.keyCode 
    if(charCode==13) 
     document.getElementById('btnSearch' + box).click(); 
}

j'ai changé la détection du mot de code pour mieux travailler avec d'autres navigateurs.

Source

2010-07-14 16:52:33 spinon

Cela fonctionne si je change à utiliser toute charCode autre que d'entrer. Lorsque j'utilise entrer le premier bouton se déclenche toujours comme si je l'avais toujours déclaré comme le bouton par défaut sur la page. J'ai vérifié pour m'assurer que je ne définissais pas la valeur par défaut quelque part et je ne suis pas. Y at-il un moyen de désactiver le bouton par défaut de sorte qu'il ne remplace pas le script de niveau de contrôle? – Starwfanatic

Avez-vous retiré le code de l'étiquette du corps? vous n'en auriez plus besoin si vous le mettez sur chaque contrôle. Pouvez-vous poster votre page pour voir ce qui se passe? – spinon

Vous pouvez utiliser les commandes asp: Panel pour vous aider. Un ASP: Panel a "DefaultButton" où vous spécifiez l'ID d'un bouton.

http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.panel.defaultbutton.aspx

Il pourrait ne pas être exactement ce dont vous avez besoin, mais il a toujours été suffisant pour mes besoins.

<asp:Panel runat="server" DefaultButton="btnSearch"> 
    <asp:TextBox id="txtSearch" runat="server" /> 
    <asp:Button id="btnSearch" runat="server" text="Start search" /> 
</asp:Panel> 

<asp:Panel runat="server" DefaultButton="btnSubmit"> 
    .... 
    <asp:Button id="btnSubmit" runat="server" text="Submit" /> 
</asp:Panel>

Espérons que cela vous aide.

Cordialement

Source

2010-07-14 16:52:43 bgs264

Merci pour votre contribution. Cela fonctionne, cependant j'utilise une table pour organiser mes boîtes de texte et boutons. Plutôt que de diviser ma table ou d'ajouter des panneaux à des cellules individuelles, je vais avec la solution de spinon.J'utiliserai très probablement cette approche dans les futures applications car c'est plus simple. :) – Starwfanatic

@Starwfanatic: Avez-vous envisagé d'utiliser divs pour votre mise en page au lieu de tables. Il vous donnera les avantages du rendu progressif et vous permettra d'utiliser la fonctionnalité par défaut asp.net. –

Je n'avais pas considéré cela. Je suis nouveau à asp.net, donc j'apprécie la suggestion. J'examinerai cela dans les futurs programmes. – Starwfanatic

Comment puis-je déclencher un événement Click Button lorsque la touche Entrée est enfoncée en fonction de la zone de texte mise en évidence?

Répondre

Questions connexes