Question

I currently have a slider control that looks like this:

<cc1:SliderExtender ID="sliderTest" runat="server" Enabled="True" 
 TargetControlID="txtBoxTest" BoundControlID="lblTestSlider"
 Decimals="0" Maximum="10" Minimum="0"
 EnableHandleAnimation="true">
</cc1:SliderExtender> 

<asp:TextBox ID="txtBoxTest" runat="server"></asp:TextBox>
<asp:Label ID="lblTestSlider" runat="server"></asp:Label>

It works, and as the slider moves the number changes from 0 to 10. Great!

What I now want to do is change the slider label (lblTestSlider) to show different text for each value from 0 to 10 (10 different text values) rather than the number. How can I do this?

Answer 1

The following is an ugly implementation, I hope someone can find something better:

<asp:UpdatePanel runat="server">
    <ContentTemplate>
        <ajax:SliderExtender ID="sliderTest" runat="server" 
            Enabled="True" 
            Decimals="0" Maximum="10" Minimum="0"
            EnableHandleAnimation="true" 
            RaiseChangeOnlyOnMouseUp="true" 
            TargetControlID="txtBoxTest" />

        <asp:TextBox ID="txtBoxTest" runat="server" 
            OnTextChanged="txtBoxTest_TextChanged" 
            AutoPostBack="true" />
        <asp:Literal ID="litDisplay" runat="server" />
    </ContentTemplate>
</asp:UpdatePanel>

And the code-behind:

protected void txtBoxTest_TextChanged(object sender, EventArgs e)
{
    switch (int.Parse(((TextBox)sender).Text))
    {
        case 0:
        case 1:
        case 2:
        case 3:
        case 4: litDisplay.Text = "Less than 5"; break;
        case 5:
        case 6:
        case 7:
        case 8:
        case 9:
        case 10: litDisplay.Text = "Greater than 5"; break;
    }
}