Questions on UI for ASP.NET AJAX Forum

1 answer

105 views

Hey guys,

I followed the steps at this link. http://www.telerik.com/help/aspnet-ajax/how-to-use-output-cache.html
It was a great resource however, can you may be add a footnote at the bottom that if you use themes in you app you need to copy the required contents of the skins folder to the theme folder. It only took me a few minutes to figure it out but it may save someone else a lot of headache. With that said it works great! Thank you!

Menu

answered on 09 Dec 2008

1 answer

85 views

Second Call to ajaxManager or ajaxPanel fails

I'm having this issue regardless of if I i use a panel or the manager. I'm trying to refresh the screen and it works the first time I call it, but then I get ajaxMgr is null the second time I call it. I have a popup window that has a form where the user enters in text, hits save, closes the window and has the screen refresh to the content they just typed. Works first time, but if they open the window again and make changes, i can't get it to find the ajax manager. Any ideas?

Popup Window code cs

    
            RadAjaxCommentPanel.ResponseScripts.Add("Close();");

Popup Window code js

    
            <script type="text/javascript"> 
        
                function Close() { 
        
                    GetRadWindow().BrowserWindow.ReloadBodyTextBlock(); 
        
                    GetRadWindow().close();   
        
                } 
        
                function GetRadWindow() 
        
                { 
        
                  var oWindow = null; 
        
                  if (window.radWindow) oWindow = window.radWindow; 
        
                  else if (window.frameElement.radWindow) oWindow = window.frameElement.radWindow; 
        
                  return oWindow; 
        
                } 
        
                </script>

Main window code

    
            <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" MasterPageFile="~/MasterPage.master" %> 
        
            <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %> 
        
            <%@ MasterType VirtualPath="~/MasterPage.master" %> 
        
            <asp:Content ContentPlaceHolderID="head" ID="head1" runat="server"> 
        
            </asp:Content> 
        
            <asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server"> 
        
                <telerik:RadAjaxManagerProxy ID="RadAjaxManagerProxy1" runat="server"></telerik:RadAjaxManagerProxy> 
        
                <telerik:RadCodeBlock ID="rcb" runat="server"> 
        
                <script type="text/javascript"> 
        
                    function ReloadBodyTextBlock() { 
        
                        var ajaxMgr = $find("<%=RadAjaxManager.GetCurrent(Page).ClientID %>"); 
        
                        ajaxMgr.ajaxRequest("ReloadBodyText"); 
        
                    } 
        
                </script>     
        
            </telerik:RadCodeBlock>     
        
                <telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server"> 
        
                <div style="float: left; padding: 6px;"> 
        
                    <asp:Panel ID="WelcomeText" runat="server"></asp:Panel> 
        
                </div> 
        
                <div style="float: right; border: solid 1px #dddddd; width: 300px;"> 
        
                    <asp:Panel DefaultButton="LogIn" ID="LoginPanel" runat="server"> 
        
                    <div style="padding: 5px;"> 
        
                        <div style="margin-top: 10px;"> 
        
                        <div style="float: left; width: 120px;">Email Address</div> 
        
                        <div style="float: left; width: 150px;"> 
        
                            <telerik:RadTextBox ID="EmailAddress" runat="server" Width="150px" MaxLength="100"></telerik:RadTextBox> 
        
                        </div>     
        
                        <div class="EndRow"></div> 
        
                        <div style="padding-top: 10px;"></div> 
        
                        <div style="float: left; width: 120px;">Password</div> 
        
                        <div style="float: left; width: 150px;"> 
        
                            <telerik:RadTextBox ID="Password" runat="server" TextMode="Password"  Width="150px" MaxLength="100" EmptyMessage=""></telerik:RadTextBox> 
        
                        </div>     
        
                        <div class="EndRow" style="padding-top: 10px;"></div> 
        
                        <div style="padding-left: 120px"> 
        
                            <asp:Button ID="LogIn" runat="server" Text="Log In" OnClick="LogIn_Click"/> 
        
                        </div> 
        
                    </div> 
        
                    </div> 
        
                    </asp:Panel> 
        
                    <asp:Panel ID="UserBox" runat="server" Visible="false"> 
        
                        <div style="padding: 5px;"> 
        
                            <div style="float:left; padding-bottom: 5px;"> 
        
                                Welcome <asp:Label ID="MyName" runat="server"></asp:Label> 
        
                            </div> 
        
                            <div style="float: right; padding-bottom: 5px;"> 
        
                                <asp:LinkButton ID="Logout" runat="server" OnClick="Logout_Click" Text="[Logout]" CssClass="LinkButton" ></asp:LinkButton> 
        
                            </div> 
        
                            <div style="clear:both;"></div> 
        
                            <asp:LinkButton ID="EditScreen" runat="server" CssClass="LinkButton" Text="[Edit Screen]" OnClientClick="EditBody(1); return false;"></asp:LinkButton> 
        
                        </div> 
        
                    </asp:Panel> 
        
                </div> 
        
                </telerik:RadAjaxPanel> 
        
            </asp:Content>

Ajax

answered on 09 Dec 2008

9 answers

220 views

[Solved] RadRotator, dynamic control within XSL

Hi,
I have been working on a solution for a while now that basically grabs an XML document, and then transforms it using XSL. Nothing special there except within the XSL I am declaring the asp.net controls such as:

<asp:Table> etc

I have got this to work succesfully for all the standard Asp.net and Ajax controls available within Visual Studio. I had built some scrolling capabilities using custom JavaScript which works but now I want to use the RadRotator control instead of the custom JavaScript. However the databinding of the control requires a datasource, in my scenario I do not have a datasource as such as it is within the XSL that is used to render the on-the-fly XML document. I have not seen any examples of using the rotator as a standard rotator without a data source attached. Is there a way of doing this? I need it to work like shown below:

<xsl:template match="/">
<div class="UpdatePanelContainer">
<asp:UpdatePanel id="UpdatePanel" UpdateMode="Always" runat="server">
<ContentTemplate>

    <telerik:RadRotator FrameDuration="4000" ID="Rotator1" runat="server" ScrollDirection="Up">
        <xsl:apply-templates select="rows/row"/>
    </telerik:RadRotator>

  </ContentTemplate>
</asp:UpdatePanel>
</div>
</xsl:template>

<xsl:template match="row">
    <ItemTemplate>
        <xsl:value-of select="MyXMLField" />
    </ItemTemplate>
</xsl:template>

Any help would be gratefully recieved. Thanks

Liam

Rotator

answered on 09 Dec 2008

2 answers

171 views

[Solved] Content in splitter

I have a radsplitter embedded in a radsplitter and a radpanel used as a menu to put content in a pane of the splitter. I am retrieving the urls to go to from a table. When the page loads, I have a .jpg being loaded into the content pane. As the user clicks on menu choices from the radpanel, different URLs are loaded. I want the user to have the ablilty to click "home" on the radpanel which would simply re-load the .jpg back in the pane. Where could I set this?
Thanks in advance for help...

Here is my code:

    
             <telerik:RadScriptManager ID="RadScriptManager1" runat="server" OutputCompression="AutoDetect"></telerik:RadScriptManager> 
        
                <telerik:RadAjaxManager ID="ajaxPanel1" runat="server" DefaultLoadingPanelID="RadAjaxLoadingPanel1"  > 
        
                    <AjaxSettings> 
        
                        <telerik:AjaxSetting AjaxControlID="RadPanelBar1"> 
        
                            <UpdatedControls> 
        
                                <telerik:AjaxUpdatedControl ControlID="contentPane"  
        
                                    LoadingPanelID="RadAjaxLoadingPanel1" /> 
        
                            </UpdatedControls> 
        
                        </telerik:AjaxSetting> 
        
                    </AjaxSettings> 
        
                 </telerik:RadAjaxManager> 
        
                <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Height="75px" Width="75px"> 
        
                    <img alt="Loading..." src='<%= RadAjaxLoadingPanel.GetWebResourceUrl(Page, "Telerik.Web.UI.Skins.Default.Ajax.loading.gif") %>' 
        
                        style="border: 0px;" /> 
        
                </telerik:RadAjaxLoadingPanel> 
        
              <telerik:RadSplitter  ID="mainSplitter" runat="server" Orientation="Horizontal" Width="100%"  height="100%"  
        
                    VisibleDuringInit="false" Skin="Office2007"  >  
        
                <telerik:RadPane id="topPane" runat="server" Width="" Height="65px"  
        
                      EnableEmbeddedBaseStylesheet="False" EnableEmbeddedSkins="False" Index="0"  
        
                      Skin=""  > 
        
                <table width="100%" cellpadding="0"  cellspacing="0" height="65px"> 
        
                 <tr align="center"> 
        
                  <td> 
        
                  <asp:Image ID="Image1" runat="server" ImageUrl="~/Img/DashboardTopLeft1.jpg" ImageAlign="Left"  /> 
        
                  </td> 
        
                  <td> 
        
                  <asp:Image ID="Image2" runat="server" ImageUrl="~/Img/DashboardTopMiddle.jpg" ImageAlign="Middle" /> 
        
                  </td> 
        
                  <td> 
        
                  <asp:Image ID="Image3" runat="server" ImageUrl="~/Img/DashboardTopRight1.jpg" ImageAlign="Right" /> 
        
                  </td> 
        
                 </tr> 
        
                </table> 
        
                </telerik:RadPane>  
        
                   <telerik:RadSplitBar id="Radsplitbar1" runat="server" collapsemode="Forward" EnableResize="false"   /> 
        
                   <telerik:RadPane ID="middlePane" runat="server"   Height="85%" Scrolling="None"   > 
        
                    <telerik:RadSplitter ID= "nestedSplitter" runat="server" Orientation="Vertical"   Skin="Office2007"   ResizeMode="AdjacentPane" width="100%"  
        
                            VisibleDuringInit="false" Height="100%" ResizeWithParentPane="true"> 
        
                     <telerik:RadPane id="leftPane" runat="server"    width="22"   minwidth="22"> 
        
                       <telerik:RadSlidingZone id="SlidingZone1" runat="server" width="22" clicktoopen="true" SkinID="Office2007" DockedPaneId="Menu" ExpandedPaneId="Menu" > 
        
                        <telerik:RadSlidingPane id="Menu" title="Menu" runat="server" width="200"  SkinID="Office2007" Scrolling="Both" EnableResize="false" > 
        
                          <telerik:RadPanelBar ID="RadPanelBar1" runat="server" DataSourceID="panelGroups"  width="180" Height="80%" 
        
                            AllowCollapseAllItems="True"  ExpandMode="SingleExpandedItem"    onclientitemclicked="itemClicked"   
        
                            Skin="Office2007" DataFieldID="FieldID" DataFieldParentID="ParentID"  
        
                            DataTextField="Text"  DataValueField="NavigateURL" > 
        
                            <CollapseAnimation Type="InOutExpo" Duration="100"></CollapseAnimation> 
        
                          </telerik:RadPanelBar> 
        
                        </telerik:RadSlidingPane> 
        
                       </telerik:RadSlidingZone> 
        
                      </telerik:RadPane> 
        
                      <telerik:RadSplitBar id="Radsplitbar3" runat="server" collapsemode="Forward" EnableResize="false" /> 
        
                      <telerik:RadPane id="contentPane" runat="server"  Scrolling="Both"  Height="100%"  >   
        
                      <center> <asp:Image ID="DashInitial" runat="server" ImageUrl="~/Img/DashboardInitialScreen.jpg" ImageAlign="Right" /> 
        
                        </center> 
        
                      </telerik:RadPane> 
        
                     </telerik:RadSplitter> 
        
                   </telerik:RadPane> 
        
                 <telerik:RadSplitBar id="Radsplitbar2" runat="server" collapsemode="Backward" EnableResize="false" /> 
        
                 <telerik:RadPane ID="BottomPane" runat="server" Width="100%" Height="24px"     > 
        
                 <table cellpadding="0" cellspacing="0" align="center" > 
        
                  <tr align="center"   > 
        
                   <td> 
        
                      <asp:Image ID="Image4" runat="server" ImageUrl="~/Img/DashboardCopyright.jpg"  ImageAlign="Middle"   /> 
        
                   </td> 
        
                  </tr> 
        
                 </table> 
        
                 </telerik:RadPane> 
        
              </telerik:RadSplitter>  
        
                <asp:SqlDataSource ID="panelGroups" runat="server"  
        
                     ConnectionString="<%$ ConnectionStrings:CC2ConnectionString %>"  
        
                     SelectCommand="SELECT [FieldID], [ParentID], [Text], [Value], [NavigateURL], [Active] FROM [DashboardPanelGroups] WHERE ([Active] = @Active)"> 
        
                    <SelectParameters> 
        
                        <asp:Parameter DefaultValue="y" Name="Active" Type="String" /> 
        
                    </SelectParameters> 
        
                 </asp:SqlDataSource> 
        
                </form> 
        
            </body> 
        
             <script type="text/javascript"> 
        
                 function itemClicked(sender, eventArgs) { 
        
                     var item = eventArgs.get_item(); 
        
                     var link = item.get_value(); 
        
                     if (link != null){ 
        
                         var splitter = $find("<%= nestedSplitter.ClientID %>"); 
        
                         var pane = splitter.getPaneById("contentPane"); 
        
                         pane.set_contentUrl(link); 
        
                     } 
        
                     var x = 1; 
        
                 }                 
        
             </script> 
        
            </html>

Splitter

answered on 09 Dec 2008

3 answers

195 views

Assigning a class or ID to the Editor content area

We are switching from CuteEditor to RadEditor but have one problem that I am so far unable to resolve.

We are using the RadEditor in the backend admin area to design content displayed in the front end. This content is itself dependent on url based theming. We override all the global styles for the front end editable page area by wrapping them in a div with ID/Class.

This makes it particularly easy to then display the content in the correct fashion in the backend preview areas by also wrapping them in an equivalent div. With CuteEditor, I was also able to set the Editor's content window with a class or ID which was great as the css inheritance could still be used.

I can't seem to do this with the RadEditor though (in firebug, i can achieve the desired affect by assigning the class name to the <body> tag within the editor's iframe, so I am thinking i might have to resort to some javascript to do this).

Do you have any suggestions

I am setting the appropriate css files in the code behind for the default and themed style sheets:

RadEditor1.CssFiles.Add(subApp.Application.FolderPath +

"/css/Default/TemplatePageContent.css");

RadEditor1.CssFiles.Add(

"/App_Themes/" + subApp.Theme + "/ThemedPageContent.css");

my global styles are then
.pagetemplate a
.pagetemplate h1
.pagetemplate li etc......

Many thanks

Editor

answered on 09 Dec 2008

1 answer

126 views

Animation does not work in RadPanelBar

Hi Telerik Team,

I am evaluating the Telerik controls,
I added a RadPanelBar on a aspx page.
It displays a Fully Expanded Panel, and animations are not working, so I presume some (client side) script is not doing its job. How can I resolve that?

Kind regards,
Nico

    
                    <telerik:RadScriptManager ID="RadScriptManager1" runat="server">  
        
                    </telerik:RadScriptManager> 
        
                    <telerik:RadPanelBar   
        
                        ID="RadPanelBar1" runat="server"   
        
                        Skin="Default2006"   
        
                        Width="500"   
        
                        ExpandMode="SingleExpandedItem"   
        
                        AllowCollapseAllItems="true"   
        
                        ExpandAnimation-Duration="300"   
        
                        ExpandAnimation-Type="InCubic"   
        
                        CollapseAnimation-Duration="150"   
        
                        CollapseAnimation-Type="InCubic" > 
        
                        <Items> 
        
                            <telerik:RadPanelItem Text="Form1">  
        
                                <ItemTemplate> 
        
                                    abc<br /> 
        
                                    def<br /> 
        
                                    ghi<br /> 
        
                                </ItemTemplate> 
        
                            </telerik:RadPanelItem> 
        
                            <telerik:RadPanelItem Text="Form2">  
        
                                <ItemTemplate> 
        
                                    abc<br /> 
        
                                    def<br /> 
        
                                    ghi<br /> 
        
                                </ItemTemplate> 
        
                            </telerik:RadPanelItem> 
        
                            <telerik:RadPanelItem Text="Form3">  
        
                                <ItemTemplate> 
        
                                    abc<br /> 
        
                                    def<br /> 
        
                                    ghi<br /> 
        
                                </ItemTemplate> 
        
                            </telerik:RadPanelItem> 
        
                            <telerik:RadPanelItem Text="Form4">  
        
                                <ItemTemplate> 
        
                                    abc<br /> 
        
                                    def<br /> 
        
                                    ghi<br /> 
        
                                </ItemTemplate> 
        
                            </telerik:RadPanelItem> 
        
                        </Items> 
        
                    </telerik:RadPanelBar>

PanelBar

answered on 09 Dec 2008

0 answers

137 views

Show/Hide column item?

I have put a GridEditCommandColumn in my grid (on each row)....which is initially visible=false;
I just want to make it visible when mouse moves over a row and invisible on mouseout...

I have added a client event OnRowMouseOver="OnNoteBookRowMouseOver" to do this...but how to do this...help me!

Grid

asked on 09 Dec 2008

1 answer

100 views

[Solved] ImagesPath issue

its crucial to finish the ImagesPath with a slash (/) or the path gets build incorrect with a backslash (\) which results in proper browsers not displaying the icons, ie doesn't care ;)

maybe you could attatch this to the http://www.telerik.com/help/aspnet-ajax/grdskins.html part

thanks

Grid

answered on 09 Dec 2008

4 answers

104 views

RadFormDecorator Causing 'Telerik is undefined' error on client

Hello,

Using the RadFormDecorator is causing my site to have the client-side error "Telerik is undefined" which causes the site not to work in IE 6, Firefox 3 (and probably earlier), and Opera 9.6.2. My app is a business app with a lot of nesting and complexity in HTML structures; for some reason, this is an issue. I don't know why this is an issue, and won't be able to replicate a small sample for a ticket.

I say this because I posted on a similar issue elsewhere, where it was stated that the issue is related to a style or css positioning, but I won't be able to post a sample of the issue.

FYI, Thanks.

FormDecorator

answered on 09 Dec 2008

1 answer

56 views

TooltTip Dispears OnClick when set to show OnFocus

I want to use the tooltip to be always visible when I click on TextBox .. the problem is when I set it to show onFocus and I click it shows for quick sec and then disappears.. the behviour I'm looking for is to have it show when onFocus and when onClick and dispears onBlur and if mouse clicked out.. here is what I got:

<telerik:RadToolTipManager
        ID="RadToolTipManager1" runat="server"
        ShowDelay="0"
        Skin="Gray"
        ManualClose="False"
        RelativeTo="Element" ShowEvent="OnFocus" AutoTooltipify="True" AutoCloseDelay="0"
                        Position="MiddleRight" OffsetY="0">
</telerik:RadToolTipManager>

Appreciate any help

ToolTip

answered on 09 Dec 2008