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

Date de publication : 08 mai 2009

Par Christian Wenz
 Pascal ROZE (Traducteur) (Page perso) (Blog)
 

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.

               Version PDF (Miroir)   Version hors-ligne (Miroir)

Traduction
Vue générale
Etapes


Traduction

Cet article est la traduction la plus fidèle possible de l'article original: en 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.

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

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

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

<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>
Le calendrier apparaît quand l'utilisateur clique dans une textbox


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


               Version PDF (Miroir)   Version hors-ligne (Miroir)

Valid XHTML 1.1!Valid CSS!

Copyright © 2009 Equipe Dotnet. Aucune reproduction, même partielle, ne peut être faite de ce site et 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. Cette page est déposée.

 
 
 
 
Partenaires

Hébergement Web