IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)

Gérer les PostBacks depuis un contrôle Popup sans UpdatePanel

L'extendeur ControlPopup de l'AJAX Control Toolkit offre une façon simple d'ouvrir un Popup lorsqu'un autre contrôle est activé. Quand un PostBack se déclenche depuis un panel et que la page contient plusieurs panels, il est difficile de déterminer sur quel panel a cliqué l'utilisateur.

Article lu   fois.

Les deux auteurs

Profil ProSite personnel

Liens sociaux

Viadeo Twitter Facebook Share on Google+   

Traduction

Cet article est la traduction la plus fidèle possible de l'article original: Handling Postbacks from A Popup Control Without an UpdatePanel

Vue générale

L'extendeur ControlPopup de l'AJAX Control Toolkit offre une façon simple d'ouvrir un Popup lorsqu'un autre contrôle est activé. Quand un PostBack se déclenche depuis un panel et que la page contient plusieurs panels, il est difficile de déterminer sur quel panel a cliqué l'utilisateur.

Etapes

Quand vous utilisez un extendeur ControlPopup avec un PostBack, mais sans avoir d'UpdatePanel dans la page, le Control Toolkit ne permet pas de savoir quel élément client a déclenché le PostBack permettant l'ouverture de la Popup. Heureusement, il existe une petite astuce.

Voilà la situation: deux textboxs qui déclenchent la même popup, à savoir un calendrier. Deux PopupControlExtenders chargés de lier les textbox et la popup.

 
Sélectionnez
<form id="form1" runat="server">      
	<asp:ScriptManager ID="asm" runat="server" />      
	<div>           
		Departure date: <asp:TextBox ID="tbDeparture" runat="server" />           
		Return date: <asp:TextBox ID="tbReturn" runat="server" />      
	</div>      
	<asp:Panel ID="pnlCalendar" runat="server">           
		<asp:Calendar ID="c1" runat="server" OnSelectionChanged="c1_SelectionChanged" />      
	</asp:Panel>     
	 <ajaxToolkit:PopupControlExtender ID="pce1" runat="server"           
	 	TargetControlID="tbDeparture" PopupControlID="pnlCalendar" Position="Bottom" />      
	 <ajaxToolkit:PopupControlExtender ID="pce2" runat="server"           
	 	TargetControlID="tbReturn" PopupControlID="pnlCalendar" Position="Bottom" /> 
</form>

L'idée de base est d'ajouter un champ caché dans l'élément <form> qui contiendra l'id de la textbox à l'origine de l'ouverture de la popup.

 
Sélectionnez
<input type="hidden" id="tbHidden" runat="server" />

Quand la page est chargée, le code Javascrip ajoute un gestionnaire d'événement aux 2 textbox: chaque fois que l'utilisateur clique sur une textbox, l'id de cette dernière est stocké dans le champ caché.

 
Sélectionnez
<script type="text/javascript">      
	function pageLoad()      
	{           
		$get("tbDeparture").onclick = saveTextBox;           
		$get("tbReturn").onclick = saveTextBox;      
	}      
	
	function saveTextBox()      
	{           
		$get("tbHidden").value = this.id;      
	} 
</script>

Côté serveur, il faut récupérer la valeur stockée dans le champ caché. Etant donné que les champs cachés sont facilement modifiables, il faut s'assurer que la valeur est valide. Une fois que la textbox a été identifiée, on y écrit la daté sélectionnée dans le calendrier.

 
Sélectionnez
<script runat="server">      
	protected void c1_SelectionChanged(object sender, EventArgs e)      
	{           
		string id = tbHidden.Value;           
		if (id == "tbDeparture" || id == "tbReturn")           
		{                
			TextBox tb = (TextBox)FindControl(id);                
			tb.Text = (sender as Calendar).SelectedDate.ToShortDateString();           
		}      
	} 
</script>
Image non disponible
Le calendrier apparaît quand l'utilisateur clique dans une textbox


Image non disponible
En cliquant sur une date, on insère sa valeur dans la textbox.

Vous avez aimé ce tutoriel ? Alors partagez-le en cliquant sur les boutons suivants : Viadeo Twitter Facebook Share on Google+   

Copyright © 2009 Equipe Dotnet. Aucune reproduction, même partielle, ne peut être faite de ce site ni de l'ensemble de son contenu : textes, documents, images, etc. sans l'autorisation expresse de l'auteur. Sinon vous encourez selon la loi jusqu'à trois ans de prison et jusqu'à 300 000 € de dommages et intérêts. Droits de diffusion permanents accordés à Developpez LLC.