Verwenden des Schiebereglers mit Auto-Postback (VB)

von Christian Wenz

PDF herunterladen

Das Schieberegler-Steuerelement im AJAX Control Toolkit bietet einen grafischen Schieberegler, der mithilfe der Maus gesteuert werden kann. Es kann ein automatischer Postback des Schiebereglers erfolgen, sobald sich der Wert ändert.

Übersicht

Das Schieberegler-Steuerelement im AJAX Control Toolkit bietet einen grafischen Schieberegler, der mithilfe der Maus gesteuert werden kann. Es kann ein automatischer Postback des Schiebereglers erfolgen, sobald sich der Wert ändert.

Schritte

Damit der Schieberegler bei einer Änderung automatisch postbacken kann, benötigen beide Textfelder das Attribut AutoPostBack="true": Das Textfeld, das zum Schieberegler selbst wird, und das Textfeld, das die Position des Schiebereglers enthält. Dies ist das erforderliche Markup dafür:

<asp:TextBox ID="Slider1" runat="server" AutoPostBack="true" />
<asp:TextBox ID="SliderValue" runat="server" AutoPostBack="true" />

Das SliderExtender Steuerelement aus dem ASP.NET AJAX Control Toolkit weist den beiden Textfeldern die Schiebereglerfunktionalität zu:

<ajaxToolkit:SliderExtender ID="se1" runat="server"
 TargetControlId="Slider1" BoundControlID="SliderValue" />

Später wird ein zusätzliches Bezeichnungselement verwendet, um den Benutzer über einen Postback zu informieren:

<asp:Label ID="LastUpdate" runat="server" />

Schließlich lädt das ScriptManager Steuerelement von ASP.NET AJAX das erforderliche JavaScript, damit das Steuerelement-Toolkit funktioniert.

<asp:ScriptManager ID="asm" runat="server" />

Jetzt wird der Schieberegler zurückgepostet; serverseitig kann dieses Ereignis abgefangen und darauf reagiert werden.

<script runat="server">
 Sub Page_Load()
 If Page.IsPostBack Then
 LastUpdate.Text = "Last update: " & DateTime.Now.ToLongTimeString()
 End If
 End Sub
</script>

Durch Verschieben des Schiebereglers wird ein Postback ausgelöst (Klicken, um das Bild in voller Größe anzuzeigen)

Danach wird das Datum dieser Änderung in der Beschriftung geschrieben (Klicken Sie hier, um das Bild in voller Größe anzuzeigen)