Introduction:
The Slider extender allows to upgrade an asp:TextBox to a graphical slider that allows the user to choose a numeric value from a finite range. The Slider's orientation can be horizontal or vertical and it can also act as a "discrete" slider, allowing only a specified number of values within its range.
The Slider extender allows to upgrade an asp:TextBox to a graphical slider that allows the user to choose a numeric value from a finite range. The Slider's orientation can be horizontal or vertical and it can also act as a "discrete" slider, allowing only a specified number of values within its range.
Description:
If the developer doesn't specify any parameters, the Slider is rendered with the default layout shown in the demonstration and its range of values goes from 0 to 100. The Slider's layout can be customized by providing CSS classes for the Slider's rail and handle. If handle animation is enabled, the handle slides to the specified point on the rail with a nice animation effect.
If the developer doesn't specify any parameters, the Slider is rendered with the default layout shown in the demonstration and its range of values goes from 0 to 100. The Slider's layout can be customized by providing CSS classes for the Slider's rail and handle. If handle animation is enabled, the handle slides to the specified point on the rail with a nice animation effect.
When
a value is chosen using the Slider, it is automatically persisted during full
or partial postbacks. The developer can continue to reference the asp:TextBox
to get and set the Slider's value.
The
Slider's value can be dynamically displayed in another asp:TextBox or an
asp:Label. If a TextBox is used, the Slider's value can be updated through the
bound TextBox.
By
declaring the extended TextBox as a trigger for an UpdatePanel, the Slider can
fire the update whenever the handle is released. By setting the
RaiseChangeOnlyOnMouseUp to false, the update will be fired as soon as the
Slider's value changes.
The
TooltipText property allows to display some text when the mouse pointer hovers
the slider's handle. A {0} placeholder in the text is replaced by the current
value of the slider.
.
|
<%@ Page Language="C#" AutoEventWireup="true" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit"
TagPrefix="cc1"
%>
<!DOCTYPE html
PUBLIC "-//W3C//DTD
XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
protected
void LinkButton1_Click(object sender, EventArgs
e)
{
int
imageWidth = Convert.ToInt32(TextBox2.Text);
Image1.Width = 1 * imageWidth;
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Ajax
SliderExtender - How to use SliderExtender in asp.net ajax</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<h2 style="color: DarkSeaGreen; font-style:
italic;">
Ajax Control Toolkit Example:
Using SliderExtender</h2>
<hr width="450" align="left" color="DarkSeaGreen" />
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<cc1:SliderExtender ID="SliderExtender1" runat="server"
TargetControlID="TextBox1"
BoundControlID="TextBox2" Minimum="200" Maximum="600">
</cc1:SliderExtender>
<br />
<table>
<tr>
<td>
<asp:TextBox ID="TextBox1" runat="server">
</asp:TextBox>
</td>
<td>
<asp:TextBox ID="TextBox2" runat="server" ForeColor="Crimson" Width="25">
</asp:TextBox>
</td>
<td>
<asp:LinkButton ID="LinkButton1" runat="server" Text="Change Image Size" ForeColor="DodgerBlue"
Font-Bold="true"
BorderColor="CornflowerBlue"
BorderWidth="1"
OnClick="LinkButton1_Click">
</asp:LinkButton>
</td>
</tr>
</table>
<br />
<asp:Image ID="Image1" runat="server" ImageUrl="~/Images/Tiger.jpg" Width="200"
/>
</div>
</form>
</body>
</html>
|
0 comments :
Post a Comment