Questions on UI for ASP.NET AJAX Forum

1 answer

292 views

Here is my grid code:

                    <telerik:RadGrid ID="radGrid1" Width="100%"          
                 AllowPaging="True" PageSize="15" runat="server" AllowSorting="True"         
                 OnNeedDataSource="OnNeed_DataSource" BorderColor="Gray"          
                 BorderWidth="1px">         
                <HeaderContextMenu EnableAutoScroll="True"></HeaderContextMenu>         
                     
                  <MasterTableView Width="100%" GridLines="Vertical" bordercolor="#CCCCCC" borderwidth="1px" AutoGenerateColumns="false">         
                      <Columns>                       
                          <telerik:GridBoundColumn UniqueName="EmpID" HeaderText="ID" SortExpression="EmpID" DataField="EmpID" />         
                          <telerik:GridBoundColumn UniqueName="EmpName" HeaderText="Name" SortExpression="EmpName" DataField="EmpName" />         
                          <telerik:GridBoundColumn UniqueName="Dept" HeaderText="Department" SortExpression="Dept" DataField="Dept"/>         
                      </Columns>         
                  </mastertableview>         
                           
                  <PagerStyle Mode="NextPrevAndNumeric" />         
                    <HeaderStyle Wrap="True" />         
                    <FilterMenu EnableTheming="True">         
                        <CollapseAnimation Duration="200" Type="OutQuint" />         
                    </FilterMenu>         
             </telerik:RadGrid>         

Please advise. Thanks

Brew

Grid

answered on 21 Jun 2010

5 answers

335 views

Grid modal popup edit appears behind fade?

Renderingissue using RadGrid built-in edit modal popup.

The issuewe have is illustrated in the attached screenshots.

This first grid1.png is ok, the grid edit popup appears in front of the dimmed out area. However, ifI fire up the same page using the machine name instead of the ip address thepopup is placed behind the dimming div as seen on grid2.png.

Thisobviously blocks the user from editing the value.

Environment:

Asp.Net,.Net framework 3.5

IE8 and IE7compatibility mode

Anyonestumbled over this before?

Otherhints?

Code:

                    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="SystemParametersView.aspx.cs" Inherits="CSAdmin.Web.SysAdmin.SystemParametersView" MasterPageFile="~/CSAdmin.Master" %>         
            <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>         
            <%@ Register TagPrefix="telerik" Namespace="Telerik.Charting" Assembly="Telerik.Web.UI" %>         
            <%@ Register Src="~/Controls/EditButtonsControl.ascx" TagName="EditButtonsControl" TagPrefix="uc1" %>         
            <%@ Register src="~/Controls/CSHiddenControl.ascx" TagName="CSHiddenControl" TagPrefix="uc1"%>         
            <asp:Content ContentPlaceHolderID="HeaderExtrasCPH" runat="server">         
            <telerik:RadAjaxManagerProxy ID="RadAjaxManagerProxy1" runat="server" >         
                <AjaxSettings>         
                            <telerik:AjaxSetting AjaxControlID="GridView">         
                                <UpdatedControls>         
                                    <telerik:AjaxUpdatedControl ControlID="GridView" />         
                                </UpdatedControls>         
                            </telerik:AjaxSetting>         
                        </AjaxSettings>         
            </telerik:RadAjaxManagerProxy>         
            <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">         
                        <script type="text/javascript">         
                            var popUp;         
                            function PopUpShowing(sender, eventArgs) {         
                                popUp = eventArgs.get_popUp();         
                                var gridWidth = sender.get_element().offsetWidth;         
                                var gridHeight = sender.get_element().offsetHeight;         
                                var popUppopUpWidth = popUp.style.width.substr(0, popUp.style.width.indexOf("px"));         
                                var popUppopUpHeight = popUp.style.height.substr(0, popUp.style.height.indexOf("px"));         
                                popUp.style.left = ((gridWidth - popUpWidth) / 2 + sender.get_element().offsetLeft).toString() + "px";         
                                popUp.style.top = ((gridHeight - popUpHeight) / 2 + sender.get_element().offsetTop -200).toString() + "px";         
                            }         
                        </script>         
                     
                    </telerik:RadCodeBlock>         
                     
                     
            </asp:Content>         
            <asp:Content ID="Content1" ContentPlaceHolderID="MainContentPlaceHolder" runat="server">         
                         
                <telerik:RadAjaxManagerProxy ID="RA" runat="server">         
                    <AjaxSettings>         
                        <telerik:AjaxSetting AjaxControlID="GridView">         
                            <UpdatedControls>         
                                <telerik:AjaxUpdatedControl ControlID="GridView" LoadingPanelID="LP" />         
                            </UpdatedControls>         
                        </telerik:AjaxSetting>         
                    </AjaxSettings>         
                </telerik:RadAjaxManagerProxy>         
                <telerik:RadAjaxLoadingPanel ID="LP" runat="server" Skin="Office2007"></telerik:RadAjaxLoadingPanel>         
                <telerik:RadGrid ID="GridView" CssClass="DTSGrid" ShowStatusBar="True" AllowSorting="True" PageSize="20" GridLines="None" AllowPaging="True"         
                        runat="server" AllowAutomaticUpdates="True" AllowMultiRowEdit="false" OnUpdateCommand="RadGrid1_UpdateCommand" OnInsertCommand="GridView_InsertCommand"         
                        AutoGenerateColumns="False" Skin="Office2007" OnItemUpdated="RadGrid1_ItemUpdated" OnNeedDataSource="RadGrid1_NeedDataSource">         
                     
                    <MasterTableView EditMode="PopUp" Width="100%" DataKeyNames="Key" AllowMultiColumnSorting="True" InsertItemDisplay="Top" CommandItemDisplay="None">         
                    <Columns>         
                            <telerik:GridBoundColumn DataField="Key" HeaderText="<%$ Resources:LocalizedText, Key %>" SortExpression="Key" />         
                            <telerik:GridBoundColumn  DataField="Value" HeaderText="<%$ Resources:LocalizedText, Value %>" UniqueName="Value" SortExpression="Value" />         
                            <telerik:GridEditCommandColumn ButtonType="ImageButton"></telerik:GridEditCommandColumn>                             
                        </Columns>         
                        <EditFormSettings CaptionDataField="Key" EditFormType="Template" PopUpSettings-Modal="true" >         
                            <FormTemplate>         
                                <div id="dockdiv" class="dockdiv">         
                                    <table>         
                                        <tr>         
                                            <td>         
                                                <asp:Label ID="Label1" runat="server" Text="<%$ Resources:LocalizedText, Key %>"></asp:Label>            
                                            </td>         
                                            <td>         
                                                <asp:TextBox ID="Key" runat="server" Text='<%# Bind("Key") %>'></asp:TextBox>         
                                                <asp:RequiredFieldValidator ID="RFV1" runat="server" ControlToValidate="Key" ErrorMessage="*"></asp:RequiredFieldValidator>         
                                            </td>         
                                        </tr>         
                                        <tr>         
                                            <td>         
                                                <asp:Label ID="Label2" runat="server" Text="<%$ Resources:LocalizedText, Value %>"></asp:Label>         
                                            </td>         
                                            <td>         
                                                <asp:TextBox ID="Value" runat="server" Text='<%# Bind("Value") %>'></asp:TextBox>         
                                                <asp:RequiredFieldValidator ID="RFV2" runat="server" ControlToValidate="Value" ErrorMessage="*"></asp:RequiredFieldValidator>         
                                            </td>         
                                        </tr>         
                                        <tr>         
                                            <td style="text-align:right">         
                                                <asp:Button ID="Save" runat="server" CommandName='<%# (Container is GridEditFormInsertItem) ? RadGrid.PerformInsertCommandName : RadGrid.UpdateCommandName %>' Text="<%$ Resources:LocalizedText, SaveButtonText %>" />         
                                            </td>         
                                            <td>         
                                                <asp:Button ID="Cancel" runat="server" CausesValidation="false"          
                                                    CommandName="Cancel" Text="<%$ Resources:LocalizedText, CancelButtonText %>" />         
                                            </td>         
                                        </tr>         
                                    </table>         
                                </div>         
                            </FormTemplate>         
                        </EditFormSettings>         
                    </MasterTableView>         
                     <ClientSettings>         
                            <ClientEvents OnPopUpShowing="PopUpShowing" />         
                     </ClientSettings>         
                </telerik:RadGrid>            
            </asp:Content>         
                     

Regards,

Carl

Grid

answered on 21 Jun 2010

2 answers

172 views

[Solved] Disable moving of files/folders

I can´t find out how to disable the ability to move (drag) files or folders in the File Explorer. Is there an easy way to disable this?
Now I can drag files or folders and then get a permission error alert. But wan´t to disable the dragging as well.

Regards

Christian

FileExplorer

answered on 21 Jun 2010

1 answer

326 views

How to remove Rename and Delete option from the Image Manager

Hi All,

I'm using Telerik Rad Editor in my project. In the Image Manager, I want only the New Folder and Upload option. I do not want Delete and Rename option. Kindly help me how to remove Delete and Rename option.

Kind Regards,

Raman

Editor

answered on 21 Jun 2010

1 answer

116 views

Disable Table Wrapper on Render

Not sure if this is possible, but I'd like to "disable" the rendering of the table wrapper on a RadToolTip control. Is this even possible? I've searched hi and low w/o any luck.

Thanks.

ToolTip

answered on 21 Jun 2010

2 answers

124 views

Modifying form input attributes

Having built a form with several inputs and a submit button, how do I set the input name attribute?

I have the following javascript:

    
                         var editor = $find("<%=RadEditor1.ClientID %>");  
        
                         var jDocument = editor.get_document();  
        
                         var jInputElements = jDocument.getElementsByTagName("input");  
        
                             var jCtr = 0;  
        
                             for (var i = 0; i < jInputElements.length; i++) {  
        
                                 if (jInputElements[i].type != 'submit') {  
        
                                     alert(jInputElements[i].type);  
        
                                     jInputElements[i].name = jInputElements[i].type + jCtr;  
        
                                 }  
        
                                 jCtr += 1;  
        
                             }

I get get the type successfully, but the code does not set the name.

Your help would be much appreciated.

Thanking you in anticipation.

Roger

Editor

answered on 21 Jun 2010

1 answer

106 views

Client Side Event for Sorting and Sorted

I'd like to call custom JS functions on Sorting and Sorted. The grid I am porting from has these two attributes, allowing me to specify functions to run:

SortingClientEvents-ColumnSorting="foo"
SortingClientEvents-ColumnSorted="bar"

I see this page, http://www.telerik.com/help/aspnet-ajax/oncommand.html, which says this will fire for sorting, which is great. Is there another event for OnCommandComplete?

Basically, sorting should fire a function to notify the user an AJAx call is in progress. Once the call is complete the notification should be removed.

Any help on this would be great.

Robert

Grid

answered on 21 Jun 2010

1 answer

174 views

height problem

hi

could you help me to set the height w/ % size of the screen?

what i want is to set the height of my data grid for the remaining spaceof my page.. im going to attach an image so u can understand what iwant..

here is the code too

                    <%@ Page Language="vb" MasterPageFile="~/Main.Master" AutoEventWireup="false" CodeBehind="SpecieVegetaliRicerca.aspx.vb" Inherits="WICEA.SpecieVegetaliRicerca" %>         
                     
                     
            <asp:Content ID="Content1" ContentPlaceHolderID="cphMain" Runat="Server">          
              <div style="height:100%">         
                <telerik:RadCodeBlock runat="server" ID="rcbSchemi">         
                    <script type="text/javascript">         
                      var myWidth = 0, myHeight = 0;         
                               
                      function setWH(){         
                          if( typeof( window.innerWidth ) == 'number' ) {         
                            //Non-IE         
                            myWidth = window.innerWidth;         
                            myHeight = window.innerHeight;         
                          } else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {         
                            //IE 6+ in 'standards compliant mode'         
                            myWidth = document.documentElement.clientWidth;         
                            myHeight = document.documentElement.clientHeight;         
                          } else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {         
                            //IE 4 compatible         
                            myWidth = document.body.clientWidth;         
                            myHeight = document.body.clientHeight;         
                          }          
                                   
                          myWidthmyWidth = myWidth * (90 / 100);         
                          myHeightmyHeight = myHeight * (90 / 100);          
                                   
                          return [myWidth, myHeight];           
                      }           
                                       
                        function ShowTraduzioneForm(id)         
                        {                                 
                            var v = setWH();         
                     
                            var oWindow = radopen("TraduttoreAnagrafica.aspx?S=SV&Id=" + id, "rwdSchemi");         
                            oWindow.setSize (v[0], v[1]);           
                            oWindow.set_behaviors(Telerik.Web.UI.WindowBehaviors.Move + Telerik.Web.UI.WindowBehaviors.Close);         
                            oWindow.set_modal(true);         
                            oWindow.center();          
                            oWindow.set_status("");                   
                            return false;             
                        }                  
                     
                        function refreshGrid()         
                        {         
                         $find("<%= RadAjaxManager1.ClientID %>").ajaxRequest("Rebind");                     
                        }                              
                    </script>         
                </telerik:RadCodeBlock>         
                <telerik:RadWindowManager ID="RadWindowManager1" runat="server" Behavior="Close,Move" InitialBehaviors="None" ReloadOnShow="true" VisibleStatusbar="false" OnClientClose="refreshGrid">         
                    <Windows>                                                                                                     
                    </Windows>         
                </telerik:RadWindowManager>         
                <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">         
                    <AjaxSettings>         
                        <telerik:AjaxSetting AjaxControlID="RadAjaxManager1">         
                            <UpdatedControls>         
                                <telerik:AjaxUpdatedControl ControlID="grdAnagraf" />         
                            </UpdatedControls>         
                        </telerik:AjaxSetting>         
                    </AjaxSettings>         
                </telerik:RadAjaxManager>           
                    <table width="80%" align="center" class="tbContorno">         
                        <tr>         
                            <th colspan="6" align="center" class="tbContenuto"><asp:Label ID="lblTitolo" runat="server" Text="Filtri di Ricerca" /></th>         
                        </tr>         
                        <tr><td colspan="6">&nbsp;</td></tr>         
                        <tr>                                         
                        <td align="center">         
                            <asp:Label runat="server" ID="lblCODICE" Text="Codice: " />         
                            <asp:TextBox runat="server" ID="txtCODICE" ToolTip="Codice Certificazione" />         
                        </td>                                         
                        <td align="center">         
                            <asp:Label runat="server" ID="lblDESCRIZIONE" Text="Descrizione: " />         
                            <asp:TextBox runat="server" ID="txtDESCRIZIONE" ToolTip="Nome" />         
                        </td>                                         
                        <td align="center">         
                            <asp:Label runat="server" ID="lblLINGUA" Text="Lingua: " />         
                            <telerik:RadComboBox runat="server" ID="lstLingua" EnableLoadOnDemand="true" LoadingMessage=" please wait... " MarkFirstMatch="true"></telerik:RadComboBox>         
                        </td>                                         
                                 
                    </tr>         
                    <tr><td colspan="4">&nbsp;</td></tr>         
                    <tr><td><div id="divWait" runat="server">         
                    <asp:Label runat="server" ID="lblWAIT" Text=""  /></div></td>         
                    </tr>         
                             
                    <tr>         
                    <td><asp:Label runat="server" ID="lblRisultato"  /></td>         
                    </tr>         
                    <tr>         
                        <td style="text-align:center" colspan="2">         
                            <asp:Button runat="server" id="cmdRicerca" Text="Cerca" OnClick="cmdRicerca_Click" Width="80px"/>         
                        </td>         
                        <td style="text-align:center" colspan="2">         
                        <asp:Button runat="server" id="cmdNuovo" Text="Inserisci" onclick="cmdNuovo_Click" Width="80px"/>         
                        </td>         
                             
                    </tr>         
                    <tr>         
                        <td><asp:Label runat="server" ID="lblErrorMsg" Text="" CssClass="ErrMsg"></asp:Label></td>         
                    </tr>         
                    </table>             
                    <hr />         
                    <div style="height:75%">         
                        <telerik:RadGrid                                
                            ID="grdAnagraf"         
                            runat="server"         
                            OnDeleteCommand="objAnagra_deleteItem"         
                            AllowPaging="false"         
                            AutoGenerateColumns="False"          
                            AllowSorting="true"         
                            AllowCustomPaging="True"         
                            AllowFilteringByColumn="false"          
                            BorderWidth="0"         
                            GridLines="Both"                         
                            Width="100%"         
                            ShowStatusBar="true"         
                            Height="100%">         
                            <ClientSettings EnableRowHoverStyle="true">         
                                <Selecting AllowRowSelect="true" />         
                                <Scrolling AllowScroll="true" UseStaticHeaders="true" SaveScrollPosition="true" />         
                            </ClientSettings>                                 
                            <MasterTableView         
                                DataKeyNames="CODICE,LINGUA"         
                                ClientDataKeyNames="CODICE,LINGUA"         
                                Width="100%"         
                                CommandItemDisplay="None">         
                                <Columns>         
                                         
                                        <telerik:GridTemplateColumn UniqueName="EditRecord" AllowFiltering="False" Resizable="False">                                    
                                            <ItemTemplate>         
                                                <asp:HyperLink ID="EditLink" runat="server" Text="Edit">         
                                                    <img src="_img/Edit.gif" alt="modifica" style="border:none" />         
                                                </asp:HyperLink>         
                                            </ItemTemplate>         
                                            <HeaderStyle Width="24px" />         
                                        </telerik:GridTemplateColumn>         
                                                 
                                    <telerik:GridTemplateColumn UniqueName="colTranslate" AllowFiltering="False" Resizable="False">                                  
                                        <ItemTemplate>         
                                            <asp:HyperLink ID="Translate" runat="server" Text="Traduci">         
                                                <img src="_img/Editor.gif" alt="modifica" style="border:none" />         
                                            </asp:HyperLink>         
                                        </ItemTemplate>         
                                        <HeaderStyle Width="24px" />         
                                    </telerik:GridTemplateColumn>                                            
                                         
                                       <telerik:GridBoundColumn DataField="CODICE" HeaderText="Codice" SortExpression="CODICE"          
                                            UniqueName="colCODICE" FilterImageToolTip="Filtro per Codice" Resizable="true">                                         
                                        </telerik:GridBoundColumn>         
                                                 
                                       <telerik:GridBoundColumn DataField="LINGUA" HeaderText="Lingua" SortExpression="LINGUA"          
                                            UniqueName="colLINGUA" FilterImageToolTip="Filtro per Codice" Resizable="true">                                         
                                        </telerik:GridBoundColumn>                                             
                                                 
                                        <telerik:GridBoundColumn DataField="DESCRIZIONE" HeaderText="Descrizione" SortExpression="DESCRIZIONE"          
                                            UniqueName="colDESCRIZIONE" FilterImageToolTip="Filtro per Descrizione" Resizable="true">          
                                        </telerik:GridBoundColumn>         
                                                 
                                        <telerik:GridBoundColumn DataField="NOMEBOTANICO" HeaderText="Nome Botanico" SortExpression="NOMEBOTANICO"          
                                            UniqueName="colNOMEBOTANICO" FilterImageToolTip="Filtro per Nome Botanico" Resizable="true">          
                                        </telerik:GridBoundColumn>                                                                                              
                                                          
                                        <telerik:GridBoundColumn DataField="ANNOTAZIONI" HeaderText="Note" SortExpression="ANNOTAZIONI"          
                                            UniqueName="colANNOTAZIONI" FilterImageToolTip="Filtro per Note" Resizable="true">         
                                            <HeaderStyle Width="220px" />         
                                        </telerik:GridBoundColumn>         
                                                 
                                        <telerik:GridButtonColumn ConfirmText="Eliminare la Specie Vegetale?" ButtonType="ImageButton" ImageUrl="_img/Delete.gif" CommandName="Delete" Text="Elimina" UniqueName="colDelete">         
                                            <HeaderStyle Width="30px" />         
                                        </telerik:GridButtonColumn>             
                                </Columns>         
                            </MasterTableView>         
                        </telerik:RadGrid>         
                    </div>         
                <asp:ObjectDataSource           
                    ID="objAnagra"           
                    runat="server"           
                    SelectMethod="selectAnagrafica"         
                    SortParameterName="orderBy"          
                    TypeName="GestioneAnagrafiche" >          
                    <SelectParameters>          
                        <asp:ControlParameter ControlID="grdAnagraf" Name="filterBy" PropertyName="MasterTableView.FilterExpression" Type="String" />          
                        <asp:QueryStringParameter Name="NomeSP" DefaultValue="SpecieVegetali_Ricerca" Direction="Input" Type="String" />         
                        <asp:Parameter Name="Chiamante" DefaultValue="STNDL" Type="String" Direction="Input" />         
                    </SelectParameters>          
                </asp:ObjectDataSource>            
                                     
                <input type="hidden" id="lblHelpPagina" runat="server"/>         
                             
                </div>         
              </asp:Content>         
                     

Grid

answered on 21 Jun 2010

1 answer

87 views

RenderSelectedPageOnly behaving strangely

Hello Telerik,

First of all you guys are rocking. I am in a stage of optimization of telerik controls performance. I have read in help that setting RenderSelectedPageOnly = true and setting autopostback of the tabstrip to true will render only pageview related to the tab. But its behaving strangely the loadingpanel sticks into the page when i added these settings.

The controls structure is as below with ajaxification where needed.

Tabstrip --> multipage --> on demand pageview adding having usercontrol dynamically added

I have a grid on whose edit I add a page view and a usercontrol dynamically.

Please look into it.

Grid

answered on 21 Jun 2010

8 answers

380 views

RadEditor as image picker.

Hi!

I have an application where the user can create an article with one image chosen as the repsenting image of the article. The main image is shown as a thumbnail when all articles are listed. However the article can contain any ammount of images.

So the user ahs to choce one image from the uploaded folder as the main image. Can i use an editor for that? I mean just the imageManager of the editor. Maybe i there is a better control?

Thank you!

Lautaro Arino.

Editor

answered on 21 Jun 2010