Slider bar is not visible and cannot be dragged

4 posts, 0 answers
  1. Rob Houck
    Rob Houck avatar
    21 posts
    Member since:
    Jul 2003

    Posted 21 Dec 2007 Link to this post

    We have a slider in a RadWindow that is initially set to visible=false. If certain conditions are met when the RadWindow opens, the slider is set to visible=true and then it can be viewed. The first time the RadWindow opens the slider appears but the bar that it slides on is no there, which means that the slider cannot be moved at all and the value cannot be changed. If the RadWindow is closed and we open it back up through the same method, the slider shows up perfectly like it should. This only happens the first time and every time after that it works perfectly. Both the RadWindow and RadSlider are prometheus Q3 2007, and we had the same problem with Q2.

    Also, even if we load the RadWindow up the first time and the slider is not visible. It will still appear correctly every time after that. We have the ReloadOnShow enabled so theoretically, it should be reloading the page from scratch each time the RadWindow opens.
  2. Petio Petkov
    Admin
    Petio Petkov avatar
    825 posts

    Posted 02 Jan 2008 Link to this post

    Hi Rob Houck,

    I tried to reproduce the problem with the following code but to no avail:

    Default.aspx:
    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="pages_Window_Integration_RadSlider_Default" %> 
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
     
    <html xmlns="http://www.w3.org/1999/xhtml" > 
    <head runat="server">  
        <title>Untitled Page</title> 
    </head> 
    <body> 
        <form id="form1" runat="server">  
        <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager> 
        <div> 
        <asp:Button ID="Button1" runat="server" Text="Open Window" /> 
        <Telerik:RadWindowManager ID="RadWindowManager1" runat="server">  
            <Windows> 
                <Telerik:RadWindow ID="RadWindow1" runat="server" VisibleOnPageLoad="false"   
                OpenerElementID="Button1" 
                NavigateUrl="Content.aspx" Width="700px" ReloadOnShow="true"></Telerik:RadWindow> 
            </Windows> 
        </Telerik:RadWindowManager> 
        </div> 
        </form> 
    </body> 
    </html> 
     


    Content.aspx:
    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Content.aspx.cs" Inherits="pages_Window_Integration_RadSlider_Content" %> 
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
     
    <html xmlns="http://www.w3.org/1999/xhtml" > 
    <head runat="server">  
        <title>Untitled Page</title>     
    </head> 
    <body> 
        <form id="form1" runat="server">  
        <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager> 
        <div> 
        <telerik:RadSlider ID="RadSlider1" runat="server" Length="600" Visible="false"/>  
         </form> 
    </body> 
    </html> 

    If you still experience this issue, please send us some code which will help us to reproduce the issue. Once we receive it we will do our best to help you.

    Best wishes,
    Petio Petkov
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Rob Houck
    Rob Houck avatar
    21 posts
    Member since:
    Jul 2003

    Posted 02 Jan 2008 Link to this post

    Here is the code we have for the RadWindow.

    <telerik:RadWindow ReloadOnShow=true ID="WdwClose" VisibleStatusbar=false Behavior="Close" Top="" NavigateUrl="" Left="" runat="server" Behaviors="Close" IntialBehavior="None" ShowContentDuringLoad="False"></telerik:RadWindow> 

    And here is the code we are using for the slider.

    <table><tr>  
                        <td  style="width: 200px">  
                        <telerik:RadSlider ID="sldPercentComplete" visible=false OnClientValueChange=updatePC runat="server" Length="150" ShowDecreaseHandle="False" 
                                ShowIncreaseHandle="False" TrackMouseWheel="False" Width="200px" /></td><td colspan=2>  
                                    <telerik:RadNumericTextBox id="txtPercentComplete" Visible=false Runat="server" Culture="English (United States)" 
                                        Type="Percent" Width="70px">  
                                        <numberformat decimaldigits="0"></numberformat> 
                                        <ClientEvents OnBlur="ValueChanged" /> 
                                    </telerik:RadNumericTextBox></td>  
                    </tr></table

    The javascript function that are called on this page ot keep the numeric textbox and slider updated are as follows. They are placed immediately after the ScriptManager declaration.

    <script language=javascript>  
                function updatePC(sender, eventArgs) {  
                    var pc = $find("<%= txtPercentComplete.ClientID %>");  
                    pc.SetValue(sender.get_Value());  
                }  
                function ValueChanged(sender, eventArgs) {  
                    var sld = $find("<%= sldPercentComplete.ClientID %>");  
                    sld.set_Value(sender.GetEditValue());             
                }  
            </script> 

    Below is the code we use to pop the RadWindow open. It looks kind of complex, but really, all it's trying to do is find out if it should be using the old RadWindow manager or if it can use the Prometheus RadWindow, once it finds out it then executes the necessary code. We are using the Prometheus Slider and Prometheus RadWindow in this example.

    function OpenRadWindow(URL, height, width, x, y, modal, behavior, title)  
    {  
        var oWindow ;  
        var oManager ;  
        var useMSAjax;  
              
        try {   
            oManager = GetRadWindowManager();  
        } catch (e) {  
            try {  
                if ($find(WdwClose) != null)  
                    useMSAjax = true;  
            } catch (e) {  
                oManager = LMSGetRadWindow().BrowserWindow.GetRadWindowManager();  
            }  
        }  
          
        if (useMSAjax) {  
            if (behavior == 'Close')  
            {  
                oWindow = $find(WdwClose);  
            }  
            else if (behavior == 'ClosePostBack')  
            {  
                oWindow = $find(WdwClosePostback);  
            }  
                  
            if (modal)  
                oWindow.set_Modal(modal);  
              
            oWindow.setUrl(URL);  
                              
            oWindow.setSize(width, height);  
              
            if (!modal)       
                oWindow.moveTo(x, y);  
                  
            if (title != '')  
                oWindow.set_Title(title);  
                  
            oWindow.show();  
        } else {  
            if (behavior == 'Close')  
            {  
                //oWindow = oManager.GetWindowByName("HeaderWdwClose");  
                oWindow = oManager.GetWindows()[0];  
                oWindow.Show();  
                try {  
                    oWindow.SetUrl(URL);  
                } catch (e){}  
            }  
            else if (behavior == 'ClosePostBack')  
            {  
                //oWindow = oManager.GetWindowByName("HeaderWdwClosePostBack");  
                oWindow = oManager.GetWindows()[1];  
                oWindow.Show();  
                try {  
                    oWindow.SetUrl(URL);  
                } catch (e){}  
            }  
            else  
                oWindow = window.radopen(URL, null);  
                  
            try {  
                oWindow.SetSize(width, height);  
            } catch (e) {}  
              
            if (modal)  
                oWindow.SetModal(modal);  
            else  
                oWindow.MoveTo(x, y);  
                  
            if (title != '')  
                oWindow.SetTitle(title);  
        }  

    We keep the code above in a separate JS file. In order for the $find to work, you have to output the following code in the parent window through the code behind.

    Page.ClientScript.RegisterStartupScript(Me.GetType"WdwClose""WdwClose = '" & WdwClose.ClientID & "';"True

    Finally, the RadWindow and the RegisterStartupScript are both in a master page.
  5. Petio Petkov
    Admin
    Petio Petkov avatar
    825 posts

    Posted 04 Jan 2008 Link to this post

    Hi Rob,

    Everything seems to be OK. Also I didn't find in your code how you make RadSlider visible.
    If you make it visible with AJAX you should register manually your skin files and set EnableEmbeddedSkins="false". For example: 

    <head id="Head1" runat="server">
    <link rel="stylesheet" href="../../../Skins/Slider.css" type="text/css"/>
    <link rel="stylesheet" href="../../../Skins/Web20/Slider.Web20.css" type="text/css"/>
    </head>
    ...................

    <telerik:RadSlider ID="RadSlider2" runat="server" Skin="Web20" Length="400" EnableEmbeddedSkins="false" />

    I hope that this will help you. If this does not help, please open a new support ticket and send us a runnable project demonstrating the problem.

    Best regards,

    Petio Petkov
    the Telerik team


    Instantly find answers to your questions at the new Telerik Support Center
Back to Top