Comment définir le focus sur la zone de texte et/ou le contrôle après avoir cliqué sur une étiquette ASP?

Question

Je voudrais mettre l'accent sur une zone de texte et/ou un contrôle après avoir cliqué sur une étiquette d'asp. Est-ce que certains peuvent m'expliquer comment faire ça? Semblable à faire un

<label for="txtBoxID">Blah</label> 

Answer 1

Vous pouvez aussi le faire

<label for="<%=txtName.ClientID%>">Name:</label> 
<asp:TextBox runat="server" ID="txtName"></asp:TextBox> 

ou point 4.

<label for="txtName">Name: </label> 
<asp:TextBox runat="server" ID="txtName" ClientIDMode="Static"></asp:TextBox> 

et éviter JavaScript.

Answer 2

Vous pouvez le faire en utilisant Javascript ou jQuery.

<label for="txtBoxID" onClientClick="SetMyFocus()">Blah</label> 

<javascript> 
function SetMyFocus() 
{ 
    document.getElementById("MyTextBox").focus(); 
} 
</javascript> 

Si vous avez un besoin spécifique de faire quelque chose du côté du serveur sur le clic de l'étiquette, vous aurez à gérer le même dans le code derrière et puis définissez le script côté client pour tirer après le rechargement de la page. Utilisez RegisterStartupScript pour le même.

Answer 3

Je suppose que vous voulez le faire complètement du côté client pour éviter une publication?

Vous pouvez utiliser jQuery pour définir le focus. Après avoir ajouté une référence de script à la bibliothèque jQuery, vous pouvez utiliser le code JavaScript suivant dans votre page:

$(document).ready(function() { 
    $("#labelId").click(function() { 
      $("*[id$='txtBoxID']").focus() 
    }); 
}); 

Le « * [id $ = « txtBoxID »] » sélecteur vous permet de sélectionner le côté serveur ASP.NET ID de votre zone de texte sans code supplémentaire. Fondamentalement, il dit "sélectionnez n'importe quel élément DOM dont l'ID se termine par txtBoxId."

Vous pouvez ajouter jQuery à votre page avec la référence de script CDN suivant:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 

Answer 4

Une solution plus généralisée en utilisant jQuery:

$(document).ready(function() { 
    $("label[for]").click(function() { 
      var inputid = '#' + $(this).attr('for'); 
      $(inputid).focus(); 
    }); 
}); 

doit gérer toutes les étiquettes, aussi longtemps que vous définissez correctement l'attribut for.

Answer 5

C'est la meilleure façon d'écrire et éviter javascript

<p> 

<asp:Label ID="lblName" runat="server" AssociatedControlID="txtFirstName" Text="First Name: " /> 

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

</p>