Zpracování postbacků z ovládacího prvku Popup Pomocí ovládacího prvku UpdatePanel (VB)

Článek
07/13/2023

Extender PopupControl v sadě nástrojů AJAX Control Toolkit nabízí snadný způsob, jak aktivovat automaticky otevírané okno, když je aktivován jakýkoli jiný ovládací prvek. Zvláštní pozornost je třeba věnovat, když v takovém automaticky otevírané nabídce dojde k zpětnému odeslání.

Přehled

Extender PopupControl v sadě nástrojů AJAX Control Toolkit nabízí snadný způsob, jak aktivovat automaticky otevírané okno, když je aktivován jakýkoli jiný ovládací prvek. Zvláštní pozornost je třeba věnovat, když v takovém automaticky otevírané nabídce dojde k zpětnému odeslání.

Postup

Při použití PopupControl se zpětným odesláním může objekt UpdatePanel zabránit aktualizaci stránky způsobené zpětným odesláním. Následující kód definuje několik důležitých prvků:

Ovládací ScriptManager prvek tak, aby ASP.NET AJAX Control Toolkit fungoval
Dva TextBox ovládací prvky, které aktivují automaticky otevírané okno
Ovládací Panel prvek, který bude sloužit jako automaticky otevírané okno
V panelu je ovládací prvek Calendar vložený do ovládacího prvku UpdatePanel .
Dva PopupControlExtender ovládací prvky, které přiřazují panel k textovým polím

<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:UpdatePanel ID="up1" runat="server">
 <ContentTemplate>
 <asp:Calendar ID="c1" runat="server" OnSelectionChanged="c1_SelectionChanged" />
 </ContentTemplate>
 </asp:UpdatePanel>
 </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>

Všimněte si OnSelectionChanged , že atribut Calendar ovládacího prvku je nastavený. Takže když uživatel vybere datum v kalendáři, dojde k zpětnému odeslání a spustí se metoda c1_SelectionChanged() na straně serveru. V rámci této metody musí být načteno aktuální datum a zapsáno zpět do textového pole.

Syntaxe je následující: Nejprve musí být vygenerován objekt proxy pro PopupControlExtender objekt na stránce. ASP.NET AJAX Control Toolkit nabízí metodu GetProxyForCurrentPopup() . Objekt vrácený touto metodou podporuje metodu Commit() , která odešle hodnotu zpět ovládacímu prvku, který aktivoval místní okno (ne ovládacímu prvku, který aktivoval volání metody).). Následující kód poskytne vybrané datum jako argument pro metodu Commit() , což způsobí, že kód zapíše vybrané datum zpět do textového pole:

<script runat="server">
 Protected Sub c1_SelectionChanged(sender As object, e As EventArgs)
 Dim pce As PopupControlExtender = AjaxControlToolkit.PopupControlExtender.GetProxyForCurrentPopup(Page)
 pce.Commit(CType(sender, Calendar).SelectedDate.ToShortDateString())
 End Sub
</script>

Když teď kliknete na datum v kalendáři, zobrazí se vybrané datum v přidruženém textovém poli a vznikne ovládací prvek pro výběr data, který je aktuálně dostupný na mnoha webech.