Questions on UI for ASP.NET AJAX Forum

1 answer

117 views

Client Side databinding -web service vs pagemethod

Hi,

I'm trying to make my app a bit more responsive so im looking into client side binding after ive added a row to the database.

I havent found any simple examples on here only partially complete complex examples. Can someone help me out with this questions - Should I be creating a webservice to retrieve information from or a webmethod (pagemethod?) or are these essentially the same thing?

Surely theres an example out there of adding information to a table and then refreshing the grid with client side binding? I'm addin the information through controls not the grid itself so i need to call a javascript method to refresh the grid.

Thanks,

Phil

Grid

answered on 25 Feb 2010

7 answers

153 views

Semi Transparent Dock

How can I set the background of a Dock to a semitransparent color ?
i.e. - some alfa values to the color

Please help
Thanks in Advance
Arijit Chatterjee

Dock

answered on 25 Feb 2010

1 answer

181 views

Cannot get Client-Side RadEditor edited text in a [runat=server] control via code-behind

I use RadEditor to edit text in a span (SPAN2) which has runat=server attribute by click on an ImageButton and load current text into RadEditor in a RadWindow and edited it. When I click submit button on RadWindow , the text display in this page is changed. But when I click Button1 to load edited text in SPAN2 into a literal (Literal1) , the Text displayed in Literal1 is not the text I edited but it display old text which declared in ASPX instead.

How to get the edited text to display in Literal1 ? I want to use edited text via code-behind.

this is my code ..

Main.aspx

                    <%@ Page language="c#" %>         
            <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">         
            <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>         
                     
            <script runat="server">         
                protected void Button1_Click(object sender, EventArgs e)         
                {         
                    Literal1.Text = SPAN2.InnerHtml;         
                }         
            </script>         
            <html xmlns="http://www.w3.org/1999/xhtml">         
                <head>         
                    <title>Name</title>         
                </head>         
                <body>         
                    <form id="Form1" method="post" runat="server">         
                    <asp:ScriptManager ID="ScriptManager1" runat="server" />         
                    <telerik:RadWindowManager ID="RadWindowManager1" runat="server">         
                        <Windows>         
                            <telerik:RadWindow runat="server" ID="Editor" Width="700px" Height="550px" />         
                        </Windows>         
                    </telerik:RadWindowManager>         
                        <script type="text/javascript">         
                        var elementToEdit = null;         
                        var oWnd = null;                     
                        function OpenWin(elemId)         
                        {         
                           elementToEdit = document.getElementById(elemId);         
                           oWnd = radopen("Editor.aspx", "Editor");         
                        }                
                        function WindowClose()         
                        {         
                           var oManager = GetRadWindowManager();         
                           var oWnd = oManager.GetWindowByName("Editor");         
                           oWnd.Close();         
                        }            
                        </script>         
                    <asp:UpdatePanel ID="UpdatePanel1" runat="server">         
                    <ContentTemplate>         
                        <span id="SPAN2" runat="server" style="border:1px solid red;">Some sample text 1</span>         
                        <asp:ImageButton ID="btnEdit2" runat="server" ImageAlign="AbsMiddle" ImageUrl="btn_textedit.png"          
                        AlternateText="Edit" CausesValidation="false" OnClientClick="OpenWin('SPAN2'); return false;" />         
                    </ContentTemplate>         
                    </asp:UpdatePanel>               
                    <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Button" />         
                    <br />         
                    <asp:Literal ID="Literal1" runat="server"></asp:Literal>                 
                    </form>         
                </body>         
            </html>         

Editor.aspx

                    <%@ Page language="c#" %>         
            <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>         
                     
            <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">         
            <html>         
                <head>         
                    <title>Edit Text</title>         
                </head>         
                <body>         
                    <form id="Form1" method="post" runat="server">         
                    <asp:ScriptManager ID="ScriptManager1" runat="server" />         
                    <script type="text/javascript">         
                        function OnClientLoad (editor)                   
                        {         
                            var oElement = window.parent.elementToEdit;         
                            if (oElement)         
                            {                
                                editor.set_html(oElement.innerHTML);         
                            }         
                            editor.add_submit(function ()         
                            {         
                                var oElement = window.parent.elementToEdit;         
                                if (oElement)         
                                {                            
                                    oElement.innerHTML = editor.get_html(true);         
                                }                            
                                window.parent.WindowClose();         
                                return false;                
                            });         
                        }         
                    </script>         
                    <telerik:RadEditor ID="editor1" OnClientLoad="OnClientLoad" Runat="server">         
                    </telerik:RadEditor>           
                    <input type="submit" value="Submit" />         
                    </form>         
                </body>         
            </html>         
                     

Thanks for your help.

Editor

answered on 25 Feb 2010

7 answers

291 views

Turn Off Edit Mode for a Row

If a row is in edit mode and user clicks on the Update link, I would like to make changes to the database in the update event of the radgrid and then make the row uneditable till he double clicks again. How do I do this on the server side?

I found this code to do this on the front end:

$find("<%= RadGridEmpData.MasterTableView.ClientID %>").cancelAll();

, but I need to do this on the server side after updates are done.

Thanks.

Suresh

Grid

answered on 25 Feb 2010

2 answers

51 views

PageSize and ASP.NET Skin

I'm having an issue using the PageSize property in the NeedDataSource event of the grid (for use with custom paging to only get the necessary records per page) when the PageSize is set in an ASP.NET skin. The PageSize property always seems to be 10 (default value) in the NeedDataSource event even though I have it set as 15 in the skin declaration, but when the grid is rendered the pager shows "items XX to XX" with the increments being 15 so this really throws off the paging since it's only actually displaying 10 per page.

Grid

answered on 25 Feb 2010

1 answer

135 views

How to do a window.open from a treeview

Hi All,
Basically, I want have the user click on a node in a treeview and have a new browser window open with the given url.
I know I can set the NavigateUrl to the url and Target='_blank', but I need to go a little further. I want to be able to have something like the link shown below. This way I can hide stuff I want to hide and size the new browser window.

<a href="javascript:void window.open('http://www.envisionaccounting.com',
'_blank','resizable=1,toolbar=0,status=0,menu=0,top=20,left=20,width=1280,height=1024')"
>
Click here!
</a>

Any help would be great!
Thanks ... Ed

TreeView

answered on 25 Feb 2010

1 answer

63 views

ItemDataBound and table that called it

If your using radGrid hierarchy tables, and use the event ItemDataBind, how do I determine what the table that called the event is? Like, if I wanted to just do code associated with the top level table.

J

Grid

answered on 25 Feb 2010

1 answer

326 views

Set RadAjaxLoadingPanel in master page to control update panel in content page

Based on the sample code in telerik demo site, I am able put a RadAjaxLoadingPanel in content page for the update panel. It is working fine and loading image is in the center of screen. Since there have a lot of content pages have similar case, I would like to move RadAjaxLoadingPanel to Master page. Also, the javascript for updatePanel would be moved to master page too. That is meaning, I only have one code base in Master page and apply AjaxLoadingPanel for all content page with UpdatePanel.

Does anyone have idea how to implement this? If it can do, will this still working for content page without update panel?

Here are code I am using in content page.

    
            <asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">  
        
                <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server"   
        
                IsSticky="true" BackgroundPosition="Center" 
        
                    Transparency="0" Height="60px" 
        
                    Width="70px" Skin="Vista">  
        
                </telerik:RadAjaxLoadingPanel> 
        
                <script language="javascript" type="text/javascript">  
        
                       function centerUpdatePanel()  
        
                        {  
        
                            centerElementOnScreen(document.getElementById('<% = RadAjaxLoadingPanel1.ClientID %>'));  
        
                        }  
        
                        function centerElementOnScreen(element)  
        
                        {  
        
                            var scrollTop = document.body.scrollTop;  
        
                            var scrollLeft = document.body.scrollLeft;  
        
                            var viewPortHeight = document.body.clientHeight;  
        
                            var viewPortWidth = document.body.clientWidth;  
        
                            if (document.compatMode == "CSS1Compat")  
        
                            {  
        
                                viewPortHeight = document.documentElement.clientHeight;  
        
                                viewPortWidth = document.documentElement.clientWidth;  
        
                                scrollTop = document.documentElement.scrollTop;  
        
                                scrollLeft = document.documentElement.scrollLeft;  
        
                            }  
        
                            var topOffset = Math.ceil(viewPortHeight / 2 - element.offsetHeight / 2);  
        
                            var leftOffset = Math.ceil(viewPortWidth / 2 - element.offsetWidth / 2);  
        
                            var top = scrollTop + topOffset - 40;  
        
                            var left = scrollLeft + leftOffset - 70;  
        
                            element.style.position = "absolute";  
        
                            element.style.top = top + "px";  
        
                            element.style.left = left + "px";  
        
                        }   
        
                    var loadingPanel = "";  
        
                    var pageRequestManager = Sys.WebForms.PageRequestManager.getInstance();  
        
                    var postBackElement = "";  
        
                    pageRequestManager.add_initializeRequest(initializeRequest);  
        
                    pageRequestManager.add_endRequest(endRequest);  
        
                    function initializeRequest(sender, eventArgs)  
        
                    {  
        
                        loadingPanel = $find('<% = RadAjaxLoadingPanel1.ClientID %>');  
        
                        postBackElement = eventArgs.get_postBackElement().id;  
        
                        loadingPanel.show(postBackElement);  
        
                        centerUpdatePanel();  
        
                    }  
        
                    function endRequest(sender, eventArgs)  
        
                    {  
        
                        loadingPanel = $find('<% = RadAjaxLoadingPanel1.ClientID %>');  
        
                        loadingPanel.hide(postBackElement);  
        
                    }   
        
                </script> 
        
               <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">  
        
                      <ContentTemplate> 
        
            .....  
        
                    </ContentTemplate> 
        
                </asp:UpdatePanel> 
        
            </asp:Content>

Ajax

answered on 25 Feb 2010

4 answers

234 views

[Solved] Hiding DetailTable Columns on Export

I am trying to customize the look & feel when exporting a fairly complex RadGrid. I have used several of the common techniques to either hide or swap out columns within the main (Master) table and those are working perfectly. However, whenever I attempt to modify the look of the DetailTable, the changes are totally ignored... specifically:

1. The detail table shows the command row (Add New / Refresh) even though the MasterTable properly hides it (ExportOnlyData is set to True as is HideStructureColumns; these are set at the grid level, could not find any separate settings at the DetailTable level).

2. Setting the column visibility to False in code (during the ItemCommand) is not working for DetailTables, though it is working fine for the columns in the MasterTable. Code below (removed some code, but not related to the column hiding; both columns ARE properly found and visibility set):

                    public void RadGrid_ItemCommand(object source, Telerik.Web.UI.GridCommandEventArgs e)         
            {         
                        RadGrid exportingGrid = source as RadGrid;         
                     
                        // only respond to the commands which invoke a built-in export         
                        switch (e.CommandName)         
                        {         
                            case RadGrid.ExportToCsvCommandName:         
                            case RadGrid.ExportToExcelCommandName:         
                            case RadGrid.ExportToPdfCommandName:         
                            case RadGrid.ExportToWordCommandName:         
                        		exportingGrid.MasterTableView.Columns.FindByUniqueName("CommandColDisplay").Visible = false;         
                                    exportingGrid.MasterTableView.DetailTables[0].Columns.FindByUniqueName("DeptCommandColDisplay").Visible = false;         
                                    break;         
                     
            }         

Any insight or hints that anyone could provide would be greatly appreciated.

Adam

Grid

answered on 25 Feb 2010

1 answer

66 views

[Solved] Image Manager, Image Editor, Custom FileBrowserContentProvider Question

Following this link here, I'm implementing a custom FileBrowserContentProvider in conjunction with the Image Manager. What I need is a way for user A to upload a file and user B to upload a file without those files being shared within a single folder. With backend code modifications, we support this by renaming the uploaded file with a GUID and storing this GUID along with the original file name and the user's AccountID (already known at login) in our data source. All works pretty good, but I have a couple issues.

1) If the user clicks on the Image Editor and modifies the image, why does the image not get refreshed in the Image Preview window? Is there some call I need to make or handle some other custom event? I couldn't find anyone else reporting issues with this.

2) I'm seeing the DeleteFile event fired when I'm in the Image Editor and click the save button. This is another one I haven't found anyone else asking about.

I'd be willing to share some code, but this is an elaborate process we have going on right now. Via the Telerik online Demos I did seem to see the demos acting similar to my first issue. Thank you for any help or direction.

Editor

answered on 25 Feb 2010