Questions on UI for ASP.NET AJAX Forum

8 answers

194 views

scrollIntoView()

Two things that we are trying to resolve:

1) Is there a method that I can call to first check if the tab needs to be scrolled to - meaning only reachable through scrolling? This way I can ONLY scroll to a tab that did not appear on the screen. I don't want to scrollIntoView() to a tab unless the tab is not visible.

2) I've noticed that scrollIntoView() scrolls to a tab and it displays the tab as the first item from the left.
I would like to see the tab being displayed as the last item on the right.

TabStrip

answered on 15 Apr 2010

1 answer

209 views

Limitations with Trial Version

Hi Team,

I would like to know the limitations/issues with radcontrols trial license version apart from the trial error message shown.

Please reply me.....

-Liji

General Discussions

answered on 15 Apr 2010

2 answers

158 views

Not able to Rename and Delete (Upload Works)

I have the following code, I get a standard prompt when renaming/deleting which prevents those actions from happening. Upload/View work great (also, new folder creation worked too when I had that enabled). The C# running on postback or not makes no difference.

"The selected file could not be deleted because the application did not have enough permissions. Please, contact the administrator."

                    <telerik:RadFileExplorer ID="RadFileExplorer1" runat="server" Height="150px" Width="450px" TreePaneWidth="122px" VisibleControls="Toolbar,ContextMenus,Grid"          
                EnableCreateNewFolder="False" ExplorerMode="Default"></telerik:RadFileExplorer>         

                            protected void Page_Load(object sender, EventArgs e)         
                    {         
                        if (!Page.IsPostBack)         
                        {         
                            //CONFIGURE EVERYTHING         
                            RadFileExplorer1.Configuration.UploadPaths = new string[] { virtualPath };         
                            RadFileExplorer1.Configuration.ViewPaths = new string[] { virtualPath };         
                            RadFileExplorer1.Configuration.DeletePaths = new string[] { virtualPath };         
                            RadFileExplorer1.InitialPath = virtualPath;         
                     
                            //Remove some buttons         
                            RadToolBarButton backBtn = null;         
                            RadToolBarButton forwardBtn = null;         
                            foreach (RadToolBarButton btn in RadFileExplorer1.ToolBar.Items)         
                            {         
                                if (btn.Value == "Back")         
                                    backBtn = btn;         
                                else if (btn.Value == "Forward")         
                                    forwardBtn = btn;         
                            }         
                            if (backBtn != null)         
                                RadFileExplorer1.ToolBar.Items.Remove(backBtn);         
                            if (forwardBtn != null)         
                                RadFileExplorer1.ToolBar.Items.Remove(forwardBtn);         
                     
                            //set the props for the upload control         
                            SetUploadProperties();         
                                     
                            RadFileExplorer1.Grid.MasterTableView.NoDetailRecordsText = "Upload files using right mouse click or the upload button.";         
                        }         
                    }         
                     
                    private void SetUploadProperties()         
                    {         
                        string[] extensionsSearch = new string[XMLFileExtensions.AllowedFileTypes.Count];         
                        for (int x = 0; x < XMLFileExtensions.AllowedFileTypes.Count; x++)         
                        {         
                            extensionsSearch[x] = "*." + XMLFileExtensions.AllowedFileTypes[x].FileExtension;         
                        }         
                        RadFileExplorer1.Configuration.SearchPatterns = extensionsSearch;         
                        RadFileExplorer1.Configuration.MaxUploadFileSize = 10485760;          
                    }         

FileExplorer

answered on 15 Apr 2010

3 answers

232 views

RadRotator not rendering correctly

I have a RadRotator in a user control that is being loaded dynamically via Ajax postback. There is a lot more levels of complexity but I don't believe that they are relevent. For instance the rotator is in a dock within a dockzone within a splitter inside of another splitter All of this within a master/content page.

My first problem is that on Ajax postback I get a javascript error: htmlfile: Could not set the rel property. Invalid property value. in a piece of code that is apparently moving <Link> tags into the <head> element.
The code is:

    
            i.rel="stylesheet"

i.rel already contains the string "stylesheet"

The links are the RadRotator CSS class files.

The second problem and most notible is that the rotator items are aligned vertically although the rotator rotates horizontally. You can only see the first item. It seems that the CSS styles are not being applied. My work around is to place the CSS definitions statically in the apsx page.

If I click refresh which loads the entire page inline the javascript error does not occur and the rotator displays correctly.

The classes that I add statically to the ASPX page are:

    
                    .rrClipRegion  .rrItemsList   
        
                    {  
        
                        float: left;  
        
                        padding: 0;  
        
                        margin: 0;  
        
                        list-style: none !important;            
        
                    }  
        
                    .rrClipRegion  .rrItemsList li   
        
                    {   
        
                        float: left;  
        
                    }  
        
                    /* For vertical carousel, not set, width defaults to auto */  
        
                    /* Note if you explicitly set width to auto, this might cause */  
        
                    /* problems with Safari */  
        
                    .RadRotator ul.rrVerticalList   
        
                    {  
        
                        padding: 0;  
        
                        margin: 0;  
        
                        list-style: none !important;  
        
                    }  
        
                    .RadRotator .rrVerticalList li  
        
                    {   
        
                        float: none;  
        
                        margin-bottom: 0px;  
        
                        /* Force the LI to respect the HEIGHT specified */  
        
                        overflow: hidden;  
        
                        display: block;  
        
                    }

This is a sufficient fix except that I still get the Ajax javascript error that I would like to get rid of.

Thanks in advance,
Doug

Rotator

answered on 15 Apr 2010

1 answer

112 views

Select the first folder after deleting

in the file explorer

from the folder pane I will delete a folder

after deleting I want to select the first folder and do refresh

FileExplorer

answered on 15 Apr 2010

9 answers

149 views

checking multiple controls on the client-side?

Hi,
Can someone please tell me how to spell check multiple controls on the client-side? It seems that there used be a demo on the website, but I guess it was replaced when server-side ControlIdSToCheck got implemented.

I would like to spell check a few pre existing textbox/textareas and also few textboxes that were created dynamically via js on the client-side, all by clicking on a single "Spell check" button.

Thanks a lot!!
Kate

Spell

answered on 15 Apr 2010

1 answer

153 views

Using an image as opener element

Hi
I am having an issue using an image control as an opener element for the window, but if I use a div it works fine.
I can't see what's wrong with this - or can't I use an image in this way?

Thanks for any hints

Clive
using version Q2 2009

    
            <telerik:RadWindow ID="RadWindow1" runat="server"   
        
                    OpenerElementID="imageClick" NavigateUrl="images/PETRUS-1med.jpg"   
        
                    Animation="Fade" VisibleStatusbar="False"   
        
                    BackColor="#5F6060" Height="710px" Width="600px">     
        
            </telerik:RadWindow> 
        
            <asp:Image ID="imageClick" runat="server"   
        
                        ImageUrl="images/PETRUS-1small.jpg"   
        
                        AlternateText="Chateau Petrus" Width="250px"   
        
                        CssClass="chateau-pics-small"   
        
                        ToolTip="Click for larger image" />

Window

answered on 15 Apr 2010

2 answers

245 views

Responding to Cancel button click on server-side

When using the RadProgressArea in a custom monitoring scenario what is the prescribed way to handle the cancel operation on the server side? I am looping through a collection of items, doing stuff and I want to check something like RadProgressContext.Current.HasCancelBeenClicked. Here is what I have so far. I am getting some odd behavior on cancel along with the progress bar percentage part not updating. If you try to invoke it a second time nothing updates.

Default.aspx:

    
            <%@ Page Language="C#" AutoEventWireup="true" %> 
        
            <%@ Import Namespace="System.Collections.Generic" %> 
        
            <%@ Import Namespace="System.Threading" %> 
        
            <%@ Import Namespace="Telerik.Web.UI" %> 
        
            <!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>Long running operation with Cancel support example</title> 
        
                <style type="text/css"> 
        
                    .Hide 
        
                    { 
        
                        display: none; 
        
                    } 
        
                </style> 
        
            </head> 
        
            <body> 
        
                <form id="form1" runat="server"> 
        
                <telerik:RadScriptManager ID="ScriptManager" runat="server" EnableHistory="true" 
        
                    EnableScriptCombine="true" OutputCompression="AutoDetect"> 
        
                    <Scripts> 
        
                        <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" /> 
        
                        <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" /> 
        
                    </Scripts> 
        
                </telerik:RadScriptManager> 
        
                <telerik:RadAjaxLoadingPanel ID="AjaxLoadingPanel" runat="server" Skin="Default" /> 
        
                <telerik:RadAjaxManager ID="AjaxManager" runat="server" DefaultLoadingPanelID="AjaxLoadingPanel"> 
        
                    <AjaxSettings> 
        
                        <telerik:AjaxSetting AjaxControlID="DoWork"> 
        
                            <UpdatedControls> 
        
                                <telerik:AjaxUpdatedControl ControlID="DoWork" UpdatePanelRenderMode="Inline" /> 
        
                            </UpdatedControls> 
        
                        </telerik:AjaxSetting> 
        
                        <telerik:AjaxSetting AjaxControlID="CancelWork"> 
        
                            <UpdatedControls> 
        
                                <telerik:AjaxUpdatedControl ControlID="CancelWork" UpdatePanelRenderMode="Inline" /> 
        
                            </UpdatedControls> 
        
                        </telerik:AjaxSetting> 
        
                    </AjaxSettings> 
        
                </telerik:RadAjaxManager> 
        
                <telerik:RadWindowManager ID="WindowManager" runat="server" /> 
        
                <asp:Button ID="ShowOptionsDialog" runat="server" CausesValidation="false" OnClientClick="ShowOptionsDialog_Click(); return false;" 
        
                    Text="Go!" /> 
        
                <asp:Button ID="DoWork" runat="server" CausesValidation="false" CssClass="Hide" OnClick="DoWork_Click" /> 
        
                <asp:Button ID="CancelWork" runat="server" CausesValidation="false" CssClass="Hide" 
        
                    OnClick="CancelWork_Click" /> 
        
                <asp:HiddenField ID="DoWorkParameters" runat="server" /> 
        
                <asp:HiddenField ID="OperationId" runat="server" /> 
        
                <telerik:RadCodeBlock runat="server"> 
        
                    <script type="text/javascript"> 
        
                        window.$ = $telerik.$; 
        
                        function ShowOptionsDialog_Click() { 
        
                            var optionsDialog = $find('<%= OptionsDialog.ClientID %>'); 
        
                            optionsDialog.show(); 
        
                        } 
        
                        function OptionsDialog_Close(sender, e) { 
        
                            var result = e.get_argument(); 
        
                            if (result) { 
        
                                var progressArea = $find($('[id$=_ProgressArea]').attr('id')); 
        
                                progressArea.show(); 
        
                                var cancelButton = progressArea._findElement("CancelButton"); 
        
                                $addHandlers(cancelButton, { "click": ProgressDialog_Cancel }, this); 
        
                                var progressDialog = $find('<%= ProgressDialog.ClientID %>'); 
        
                                progressDialog.show(); 
        
                                $('<%= "#" + DoWorkParameters.ClientID %>').val(result); 
        
                                // TODO: get an operation ID with AJAX 
        
                                var operationId = "{EE1B4300-CF80-4CF1-9C01-5E6412DAEC00}"; 
        
                                $('<%= "#" + OperationId.ClientID %>').val(operationId); 
        
                                $get('<%= DoWork.ClientID %>').click(sender, e); 
        
                            } 
        
                        } 
        
                        function ProgressDialog_Cancel(sender, e) { 
        
                            $get('<%= CancelWork.ClientID %>').click(sender, e); 
        
                            return false; 
        
                        } 
        
                        function ProgressDialog_Close(title, message) { 
        
                            var progressArea = $find($('[id$=_ProgressArea]').attr('id')); 
        
                            progressArea.hide(); 
        
                            var progressDialog = $find('<%= ProgressDialog.ClientID %>'); 
        
                            progressDialog.close(); 
        
                            var resultsDialog = $find('<%= ResultsDialog.ClientID %>'); 
        
                            resultsDialog.set_title(title); 
        
                            resultsDialog.argument = message; 
        
                            resultsDialog.show(); 
        
                        } 
        
                        Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(BeginRequestHandler); 
        
                        function BeginRequestHandler(sender, args) { 
        
                            var elem = args.get_postBackElement(); 
        
                            if (elem.id == '<%= CancelWork.ClientID %>') { 
        
                                args.set_cancel(false); 
        
                            } 
        
                        } 
        
                    </script> 
        
                </telerik:RadCodeBlock> 
        
                <telerik:RadWindow ID="OptionsDialog" runat="server" Behaviors="Move, Resize, Close" 
        
                    KeepInScreenBounds="true" Modal="true" NavigateUrl="~/Options.aspx" OnClientClose="OptionsDialog_Close" 
        
                    ReloadOnShow="true" ShowContentDuringLoad="false" Title="Operation Options" VisibleStatusbar="false" /> 
        
                <telerik:RadWindow ID="ProgressDialog" runat="server" Behaviors="None" KeepInScreenBounds="true" 
        
                    Height="250px" Modal="true" ShowContentDuringLoad="false" VisibleTitlebar="false" 
        
                    VisibleStatusbar="false" Width="500px"> 
        
                    <ContentTemplate> 
        
                        <telerik:RadProgressArea ID="ProgressArea" runat="server" DisplayCancelButton="true" 
        
                            ProgressIndicators="CurrentFileName,TimeElapsed,TimeEstimated,TotalProgress,TotalProgressBar,TotalProgressPercent" 
        
                            Width="100%" /> 
        
                        <telerik:RadProgressManager ID="ProgressManager" runat="server" /> 
        
                    </ContentTemplate> 
        
                </telerik:RadWindow> 
        
                <telerik:RadWindow ID="ResultsDialog" runat="server" Behaviors="Move, Resize, Close" 
        
                    KeepInScreenBounds="true" Modal="true" NavigateUrl="~/Results.aspx" ReloadOnShow="true" 
        
                    ShowContentDuringLoad="false" VisibleStatusbar="false" /> 
        
                </form> 
        
            </body> 
        
            </html> 
        
            <script runat="server"> 
        
                static Dictionary<Guid, WorkState> stateDictionary = new Dictionary<Guid, WorkState>(); 
        
                protected void DoWork_Click(object sender, EventArgs e) 
        
                { 
        
                    var stateId = new Guid(OperationId.Value); 
        
                    stateDictionary.Add(stateId, new WorkState { Argument = DoWorkParameters.Value }); 
        
                    ThreadPool.QueueUserWorkItem(DoActualWork, stateId); 
        
                    var state = stateDictionary[stateId]; 
        
                    while (!state.IsComplete) 
        
                    { 
        
                        RadProgressContext.Current.CurrentOperationText = state.Message ?? string.Empty; 
        
                        RadProgressContext.Current.PrimaryPercent = state.PercentComplete; 
        
                        Thread.Sleep(500); 
        
                    } 
        
                    var resultTitle = !state.IsAborted ? "Operation successful!" : "Operation failed."; 
        
                    var resultMessage = !state.IsAborted ? "Your request was fulfilled." : "Your request was canceled"; 
        
                    RadProgressContext.Current.OperationComplete = true; 
        
                    RadAjaxManager.GetCurrent(this).ResponseScripts.Add(string.Format("ProgressDialog_Close('{0}', '{1}');", resultTitle, resultMessage)); 
        
                    stateDictionary.Remove(stateId); 
        
                } 
        
                protected void CancelWork_Click(object sender, EventArgs e) 
        
                { 
        
                    var stateId = new Guid(OperationId.Value); 
        
                    if (stateDictionary.ContainsKey(stateId)) 
        
                    { 
        
                        stateDictionary[stateId].AbortRequested = true; 
        
                    } 
        
                } 
        
                void DoActualWork(object o) 
        
                { 
        
                    var state = stateDictionary[(Guid)o]; 
        
                    var maxItems = 20; 
        
                    for (var itemIndex = 0; itemIndex < maxItems; itemIndex++) 
        
                    { 
        
                        System.Diagnostics.Debug.Write(itemIndex); 
        
                        state.Message = string.Format("Operation {0} - {1}", state.Argument, itemIndex); 
        
                        state.PercentComplete = itemIndex / maxItems * 100; 
        
                        Thread.Sleep(1000); 
        
                        if (state.AbortRequested) 
        
                        { 
        
                            state.IsAborted = true; 
        
                            break; 
        
                        } 
        
                    } 
        
                    state.IsComplete = true; 
        
                } 
        
                class WorkState 
        
                { 
        
                    public object Argument; 
        
                    public string Message; 
        
                    public int PercentComplete; 
        
                    public bool IsComplete; 
        
                    public bool AbortRequested; 
        
                    public bool IsAborted; 
        
                } 
        
            </script>

Options.aspx:

    
            <%@ Page Language="C#" AutoEventWireup="true" %> 
        
            <!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"> 
        
            <body> 
        
                <form id="form1" runat="server"> 
        
                <div> 
        
                    <input id="Name" type="text" value="Calculate Pii" /> 
        
                </div> 
        
                <div> 
        
                    <button onclick="Close(document.getElementById('Name').value);"> 
        
                        Go!</button> 
        
                    <button onclick="Close(null);"> 
        
                        Cancel</button> 
        
                </div> 
        
                <script type="text/javascript"> 
        
                    function GetRadWindow() { 
        
                        var radWindow = null; 
        
                        if (window.radWindow) { 
        
                            radWindow = window.radWindow; 
        
                        } 
        
                        else if (window.frameElement.radWindow) { 
        
                            radWindow = window.frameElement.radWindow; 
        
                        } 
        
                        return radWindow; 
        
                    } 
        
                    function Close(returnValue) { 
        
                        var radWindow = GetRadWindow(); 
        
                        if (returnValue == undefined) { 
        
                            radWindow.argument = null; 
        
                            radWindow.close(); 
        
                        } 
        
                        else { 
        
                            radWindow.close(returnValue); 
        
                        } 
        
                    } 
        
                </script> 
        
                </form> 
        
            </body> 
        
            </html>

Result.aspx:

    
            <%@ Page Language="C#" AutoEventWireup="true" %> 
        
            <!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"> 
        
            </head> 
        
            <body> 
        
                <form id="form1" runat="server"> 
        
                <telerik:RadScriptManager ID="ScriptManager" runat="server" EnableHistory="true" 
        
                    EnableScriptCombine="true" OutputCompression="AutoDetect"> 
        
                    <Scripts> 
        
                        <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" /> 
        
                        <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" /> 
        
                    </Scripts> 
        
                </telerik:RadScriptManager> 
        
                <div id="Message"> 
        
                </div> 
        
                <input type="button" value="Close" onclick="Close(null);" /> 
        
                <script type="text/javascript"> 
        
                    window.$ = $telerik.$; 
        
                    function GetRadWindow() { 
        
                        var radWindow = null; 
        
                        if (window.radWindow) { 
        
                            radWindow = window.radWindow; 
        
                        } 
        
                        else if (window.frameElement.radWindow) { 
        
                            radWindow = window.frameElement.radWindow; 
        
                        } 
        
                        return radWindow; 
        
                    } 
        
                    function Close(returnValue) { 
        
                        var radWindow = GetRadWindow(); 
        
                        if (returnValue == undefined) { 
        
                            radWindow.argument = null; 
        
                            radWindow.close(); 
        
                        } 
        
                        else { 
        
                            radWindow.close(returnValue); 
        
                        } 
        
                    } 
        
                    $(document).ready(function () { 
        
                        var window = GetRadWindow(); 
        
                        $("#Message").text(window.argument); 
        
                    }); 
        
                </script> 
        
                </form> 
        
            </body> 
        
            </html>

Upload (Obsolete)

answered on 15 Apr 2010

1 answer

102 views

[Solved] Setting Filter on ItemCreated

I have the following code

    
            protected void RadGrid2_ItemCreated(object sender, Telerik.Web.UI.GridItemEventArgs e)  
        
                    {  
        
                        if (e.Item is GridFilteringItem)  
        
                        {  
        
                            RadGrid2.MasterTableView.FilterExpression = "([Active] = true) ";  
        
                            GridColumn column = RadGrid2.MasterTableView.GetColumnSafe("Active");  
        
                            column.CurrentFilterFunction = GridKnownFunction.EqualTo;  
        
                            column.CurrentFilterValue = "True";  
        
                        }  
        
                    }

I then later in jave script use

    
            nestedView.get_filterExpressions().toDynamicLinq()

to get the current filter. The problem is when I hit this line of code It cliams the filter if blank. Am I missing something?

Just some more backgroud. This is happening in a nested grid taht is nested by use of panels. The ItemCreated is running when the page loads, then when the use selects a record from RadGrid1 it runs a webservice that getst the data then in java script updates the nested grid.

Grid

answered on 15 Apr 2010

1 answer

75 views

Spellcker swept the viewstate value

Hi,

I am using spell check component on the webpart. The webpart loads 5 usercontrol and display the appropriate page based on the event. I have added the spell checker on each user control and associate this with the respective text boxes. As the spellchecker needs the scriptmanager on the page before loading the spellcheck component, I have dynamically loaded the scriptmanager on the page init method of the webpart. The spellchecker works fine but the viewstate values disappear. Later I replaced the Scriptmanager with Radscript manager(Had a thought that the Rad scriptmanager must be customised for the state management), but still have the similar issue.

Later again, I register the Radscriptmanager on the ASPX page where the webpart is loaded, that was working fine and view state appear properly. But when I publish the page, it start throwing the error (Message: Script manager must be registered before RadSpell control. Message: RadSpell must be registered before prerender)

I am a bit stressed at the moment as we are already have missed the deadline.

I am hoping to get the immediate resolution of this issue.

Thanks
Dhananjay

Calendar

answered on 15 Apr 2010