New to Telerik UI for ASP.NET AJAX? Download free 30-day trial

Static/Dynamic Object Creation

This slider is declaratively created in the ASPX page:

This slider is programmatically created on the server:

to create a new slider using ASP.NET UpdatePanel

to create a new slider on the client
You can initialize the RadSlider in three different ways in your page:
  • Declaratively in the ASPX page
  • Programmatically in the code behind
  • Programmatically on the client
  • DefaultCS.aspx
  • DefaultCS.aspx.cs
  • scripts.js
  • styles.css
<%@ Page Language="c#" AutoEventWireup="true" Inherits="Telerik.Web.Examples.Slider.DynamicObjectCreation.DefaultCS"CodeFile="DefaultCS.aspx.cs"  %>

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
    <script src="scripts.js" type="text/javascript"></script>
    <link href="styles.css" rel="stylesheet" type="text/css" />
</head>

<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
    <div class="demo-container">
        This slider is declaratively created in the ASPX page:<br />
        <telerik:RadSlider RenderMode="Lightweight" runat="server" ID="RadSlider1" Value="50" OnClientLoad="demo.sliderClientLoad">
        </telerik:RadSlider>
        <br />
        This slider is programmatically created on the server:<br />
        <asp:Panel ID="Panel1" runat="server">
        </asp:Panel>
        <br />
        <telerik:RadAjaxPanel runat="server" ID="RadAjaxPanel1">
            <div>
                <telerik:RadButton RenderMode="Lightweight" ID="RadButton1" runat="server" Text="Click Here" OnClick="RadButton1_Click"></telerik:RadButton>
                <span>to create a new slider using ASP.NET UpdatePanel</span>
                <asp:Label ID="Label2" runat="server"></asp:Label>
            </div>
        </telerik:RadAjaxPanel>
        <br />
        <div>
            <telerik:RadButton RenderMode="Lightweight" ID="RadButton2" runat="server" Text="Click Here"
                AutoPostBack="false" OnClientClicked="demo.createSlider">
            </telerik:RadButton>
            <span>to create a new slider on the client</span>
            <div id="elementToExtend">
            </div>
        </div>
    </div>
    </form>
</body>
</html>

Support & Learning Resources

Find Assistance