数据绑定滑块控件 (C#)

作者 :Christian Wenz

下载 PDF

AJAX 控件工具包中的 Slider 控件提供可使用鼠标控制的图形滑块。 可以将滑块的当前位置绑定到另一个 ASP.NET 控件。

概述

AJAX 控件工具包中的 Slider 控件提供可使用鼠标控制的图形滑块。 可以将滑块的当前位置绑定到另一个 ASP.NET 控件。

步骤

若要激活 ASP.NET AJAX 和 Control Toolkit 的功能, ScriptManager 必须将控件放置在页面上的任意位置 (但 <form> 位于 元素) :

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

接下来,将两个 TextBox 控件添加到页面。 一个将转换为图形滑块,另一个将保留滑块的位置。

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

下一步已经是最后一步。 SliderExtender ASP.NET AJAX 控件工具包中的控件从第一个文本框生成滑块,并在滑块位置更改时自动更新第二个文本框。 为了使它正常工作, SliderExtender必须将 的 TargetControlID 属性设置为第一个文本框的 ID; BoundControlID 必须将 属性设置为第二个文本框的 ID。

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

如浏览器中所示,数据绑定可双向工作:在文本框中输入新值会更新滑块的位置。 如果使第二个文本框只读,则可以向文本字段添加弱保护,以便用户更难手动更新其中的值。

滑块和文本框同步

滑块和文本框同步 (单击以查看全尺寸图像)