2010-01-04 5 views
2

Comment exécuter une fonction en JavaScript lorsqu'une zone de texte est remplie de texte? La zone de texte avec être caché à l'utilisateur. Il sera peuplé par un tireur de carte magnétique USB.Exécuter une fonction javascript lorsque la zone de texte est remplie dans jQuery?

Code Pseudo:

<script language="javascript" type="text/javascript"> 
    function MyFunction() { 
     //execute this function when MyTxtBox is populated 
    } 
</script> 
<asp:TextBox id="MyTxtBox" runat="server" Visible="false" /> 
+0

Qu'est-ce qu'un TextBox? Est-ce un textarea? – slebetman

+0

Non, ce n'est pas une zone de texte. Je peux le changer si cela peut aider. Il est important que caché à l'utilisateur. –

+0

Lorsque vous dites que la valeur est remplie par un lecteur de cartes magnétiques USB, est-ce fait du côté serveur? Si c'est le cas, OnChange pour la zone de texte (JS) ne se déclenchera probablement pas. Donc, vous devrez peut-être aller avec la première recommandation de Munch. –

Répondre

3

Cela semble être le cas lorsque vous chargez la page. Si vous êtes, cela fonctionnerait.

$(document).ready(function(){ 
    if($('#MyTxtBox').val().length > 0){ 
     MyFunction(); 
    } 
}); 

S'il est sur le changement:

$(document).ready(function(){ 
    $('#MyTxtBox').change(function(){ 
     if($(this).val().length > 0){ 
      MyFunction(); 
     } 
    }); 
}); 
+0

Je reçois une erreur de compilation "Expected ',' ou ')'" avec l'échantillon on change. –

+0

Oups, il devrait y avoir un ');' après la fin de la fonction de changement. Il est maintenant corrigé – munch

+0

Vous répondez fonctionne lorsque l'attribut de style 'MyTxtBox' n'est pas défini sur' display: none; '. Cela ne fonctionne pas lorsque le 'MyTxtBox' est caché –

0

Fixer à l'événement onChange de MyTxtBox. Vous devez faire un peu d'ASP.NET pour produire le ClientID approprié à utiliser dans JavaScript, car ASP.NET va modifier l'ID MyTxtBox en quelque chose d'autre.

<asp:TextBox id="MyTxtBox" runat="server" Visible="false" /> 
<script language="javascript" type="text/javascript"> 
    function MyFunction() { 
     //execute this function when MyTxtBox is populated 
    } 

    document.getElementById("<%= MyTxtBox.ClientID %>").onChange = MyFunction; 
</script> 
+0

Allume-t-on le feu si l'élément reste net? Si l'entrée de balayage USB ne passe pas automatiquement au champ suivant et reste juste à la fin de la chaîne, les navigateurs vont-ils déclencher cet événement onchange? – Anthony

+0

@Anthony - Vous avez raison. L'événement onChange ne se déclenchera que si le focus passe au champ de formulaire suivant. Je dois déclencher l'événement une fois que la zone de texte est remplie. –

1

Voir la réponse de Munch, mais utiliser les CSS pour cacher la zone de texte comme la définition de visible = false entraînera la zone de texte HTML ne sont pas rendus et donc ne pas être disponibles du côté client.

<style type="text/css"> 
.USBBox 
{ 
    position: absolute; 
    left: -999em; 
    overflow: hidden; 
} 
</style> 
<asp.textbox id="MyTextBox" runat="server" CSSClass="USBBox" /> 

Vous pouvez ensuite utiliser le sélecteur de classe de jQuery pour acces la zone de texte sans vous soucier de nom mutiler:

%('.USBBox') 

Si vous avez beaucoup d'éléments sur la page mais vous pourriez être mieux Accès par id, auquel cas utiliser l'identifiant client pour éviter tout nom: problèmes mutiler

$('#<%= MyTextBox.ClientID %>') 

Mise à jour

La solution CSS utilisée fournie dans ce link pour masquer la zone de texte de l'utilisateur. Mise à jour de la classe CSS USBBox avec la solution correcte en tant qu'afficheur: aucune n'a causé de problèmes javaScript.

+0

@Michael, merci pour la mise à jour, heureux d'avoir été utile –

Questions connexes