Поделиться через


Использование элемента управления Ползунок с автоматической обратной отправкой (C#)

Кристиан Венц

Загрузить PDF-файл

Элемент управления Slider в наборе элементов управления AJAX предоставляет графический ползунок, которым можно управлять с помощью мыши. Ползунок можно сделать автозаставкой после изменения его значения.

Общие сведения

Элемент управления Slider в наборе элементов управления AJAX предоставляет графический ползунок, которым можно управлять с помощью мыши. Ползунок можно сделать автозаставкой после изменения его значения.

Этапы

Чтобы ползунок автоматически помещается после изменения, обоим текстовым полям нужен атрибут AutoPostBack="true": текстовое поле, которое станет самим ползунком, и текстовое поле, в котором находится положение ползунка. Ниже приведена необходимая разметка для этого.

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

Элемент SliderExtender управления из набора элементов управления ASP.NET AJAX назначает функции ползунка двум текстовым полям:

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

Позже дополнительный элемент метки будет использоваться для информирования пользователя о обратной отправке:

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

Наконец, ScriptManager элемент управления ASP.NET AJAX загружает необходимый код JavaScript для работы набора средств управления:

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

Теперь ползунок снова; На стороне сервера это событие может быть перехвачено и предпринят следующие действия:

<script runat="server">
 void Page_Load()
 {
 if (Page.IsPostBack)
 {
 LastUpdate.Text = "Last update: " + DateTime.Now.ToLongTimeString();
 }
 }
</script>

Перемещение ползунка активирует обратную передачу

При перемещении ползунка активируется обратная связь (щелкните для просмотра полноразмерного изображения)

После этого дата этого изменения записывается в метку

После этого дата этого изменения записывается в метку (щелкните, чтобы просмотреть изображение в полном размере)