This is a migrated thread and some comments may be shown as answers.

Slide a Multiline TextBox Open and Closed

2 Answers 69 Views
PanelBar
This is a migrated thread and some comments may be shown as answers.
kencox
Top achievements
Rank 1
kencox asked on 06 Apr 2010, 05:48 AM
Hi folks,

I have a large multi-line radtextbox that I want to hide when not in use. I can show and hide it with javascript but I don't like the jarring effect. I'm trying to use the PanelBar to get a smooth show/hide effect. Can anyone show me why the code below doesn't work - or a technique that does?

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_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></title>  
</head> 
<body> 
    <form id="form1" runat="server">  
    <telerik:RadScriptManager ID="RadScriptManager1" runat="server">  
    </telerik:RadScriptManager> 
    <div> 
        <telerik:RadScriptBlock runat="server" ID="RadScriptBlock1">  
 
            <script type="text/javascript">  
                function showItem(panelbar, args) {  
                    var itm = args.get_item()  
                    itm.expand();  
                }  
                function hideItem(panelbar, args) {  
                    var itm = args.get_item()  
                    itm.collapse();  
                }  
            </script> 
 
        </telerik:RadScriptBlock> 
        <telerik:RadPanelBar ID="RadPanelBar1" runat="server" Width="100%" renderingcompatibility="3.5" 
            ExpandMode="SingleExpandedItem" CollapseAnimation-Duration="1000" CollapseAnimation-Type="InElastic" 
            OnClientMouseOut="hideItem" OnClientMouseOver="showItem">  
            <Items> 
                <telerik:RadPanelItem runat="server" Expanded="false" Text="Root RadPanelItem1">  
                    <ItemTemplate> 
                        <div> 
                            <telerik:RadTextBox ID="txtExtendedDescription" runat="server" MaxLength="5000" Height="100%" 
                                Rows="10" TextMode="MultiLine" Width="75%" /></div>  
                    </ItemTemplate> 
                </telerik:RadPanelItem> 
            </Items> 
        </telerik:RadPanelBar> 
    </div> 
    </form> 
</body> 
</html> 
 

Thanks,

Ken

2 Answers, 1 is accepted

Sort by
0
Accepted
Simon
Telerik team
answered on 06 Apr 2010, 02:10 PM
Hello Ken Cox,

Since RadPanelBar does not animate an Item that has Template you need to put the RadTextBox inside a child of the root Item to make it work, i.e.
<telerik:RadPanelBar ID="RadPanelBar1" runat="server" Width="100%" renderingcompatibility="3.5"
    ExpandMode="SingleExpandedItem" CollapseAnimation-Duration="1000" CollapseAnimation-Type="InElastic"
    OnClientMouseOut="hideItem" OnClientMouseOver="showItem">
    <Items>
        <telerik:RadPanelItem runat="server" Expanded="false" Text="Root RadPanelItem1">
            <Items>
                <telerik:RadPanelItem runat="server">
                    <ItemTemplate>
                        <div>
                            <telerik:RadTextBox ID="txtExtendedDescription" runat="server" MaxLength="5000" Height="100%"
                                Rows="10" TextMode="MultiLine" Width="75%" /></div>
                    </ItemTemplate>
                </telerik:RadPanelItem>
            </Items>
        </telerik:RadPanelItem>
    </Items>
</telerik:RadPanelBar>

I hope this helps.

Kind regards,
Simon
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
0
kencox
Top achievements
Rank 1
answered on 06 Apr 2010, 07:03 PM
Hi Simon,

Thanks, that worked.

Ken
Tags
PanelBar
Asked by
kencox
Top achievements
Rank 1
Answers by
Simon
Telerik team
kencox
Top achievements
Rank 1
Share this question
or