Telerik Forums
UI for ASP.NET AJAX Forum
1 answer
81 views
Hello,

I have a SharePoint 2013 application page with a RadContext menu in it.  I am trying to use it as a drop down and it is not working.  Here is my code.  Why isn't it working?
<asp:Content ID="PageHead" ContentPlaceHolderID="PlaceHolderAdditionalPageHead" runat="server">
 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
 
    <script type ="text/javascript">
 
        function showMenu(e) {
            var test = id;
            var contextMenu = $("#ctl00_PlaceHolderMain_ctxMenuDocument");
              $telerik.cancelRawEvent(e);
              if ((!e.relatedTarget) || (!$telerik.isDescendantOrSelf(contextMenu.get_element(), e.relatedTarget))) {
                  contextMenu.show(e);
              }
          }
         
    </script>
 
</asp:Content>
 
<asp:Content ID="Main" ContentPlaceHolderID="PlaceHolderMain" runat="server">
             
    <asp:Button runat="server" Text="Test" OnClientClick="showMenu(event)" />
 
    <telerik:RadContextMenu ID="RadContextMenu1" runat="server" >
        <Items>
                <telerik:RadMenuItem Text="Trees" />
                <telerik:RadMenuItem Text="Sunset" />
                <telerik:RadMenuItem Text="Mountains" />
        </Items>
    </telerik:RadContextMenu>
 
</asp:Content>
Dan Harvey
Top achievements
Rank 2
 answered on 18 Jul 2013
10 answers
139 views
Hello!

I'm having an issue with my scenario and It seems I can't resolve it. I have a button to copy data from a form to another. Actually, correctly speaking, it is the same form, but fields are in separate tabs.

This button uses javascript on client to copy the data. With text boxes there is no problem, very straight forward. The problem is with combos.

In tab1, there is 3 combos. The first one is bound server side. After selection, there is a call to clientside RequestItems which populates the next combo, then after selection on the second one, same thing for the third one. All works well and perfect.

Te problem is when I try to copy those selections to another 3 combos on tab2. Here is the javascript code snippet:
cmbDistritoEE.trackChanges();
cmbDistritoEE.get_items().getItem(cmbDistritoPai.get_selectedIndex()).select();
var item = cmbDistritoEE.get_items().getItem(cmbDistritoPai.get_selectedIndex());
cmbDistritoEE.commitChanges();
cmbConcelhoEE.requestItems(item.get_value(), false);
 
cmbConcelhoEE.trackChanges();
cmbConcelhoEE.get_items().getItem(cmbConcelhoPai.get_selectedIndex()).select();
item = cmbConcelhoEE.get_items().getItem(cmbConcelhoPai.get_selectedIndex());
cmbConcelhoEE.commitChanges();
cmbFreguesiaEE.requestItems(item.get_value(), false);
 
cmbFreguesiaEE.trackChanges();
cmbFreguesiaEE.get_items().getItem(cmbFreguesiaPai.get_selectedIndex()).select();
item = cmbFreguesiaEE.get_items().getItem(cmbFreguesiaPai.get_selectedIndex());
cmbFreguesiaEE.commitChanges();

The issue occurs when RequesItems is called oncmbConcelhoEE combobox and in the following lines, when get_items() is called on cmbConcelhoEE there are no items. After a "second pass" (i.e. clicking second time on the button) there are items. This is because of the RequestItems callback mechanism.

My question: how do I manage to do this client side?

Best regards!
Stargazer
Top achievements
Rank 2
 answered on 18 Jul 2013
4 answers
280 views
Hi,

I have an issue with javascript fireCommand while firing "PerformInsert" and "Update". It fires the Grids ItemCommand but doesn't pass the Command name to my ItemCommand event handler. Here is the code snippet -

                   
<telerik:RadGrid ID="radVehicles" runat="server" AutoGenerateColumns="false" EnableViewState="true"
    PagerStyle-AlwaysVisible="true" GridLines="None" AllowSorting="true" AllowPaging="true" AllowAutomaticUpdates="false"
    AllowMultiRowEdit="false"                                   
    CellSpacing="0" PageSize="10" AllowFilteringByColumn="false" OnNeedDataSource="Vehicles_OnNeedDataSource" OnCancelCommand="ConvertVehicles_OnCancelCommand"
    OnItemDataBound="Vehicles_OnItemDataBound" OnItemCommand="Vehicles_OnItemCommand">
    <PagerStyle PageButtonCount="5" PagerTextFormat="{4}Total Rows: {5}" AlwaysVisible="true" />
    <MasterTableView DataKeyNames="VehiclesID, Active" ClientDataKeyNames="VehiclesID, Active">
        <NoRecordsTemplate>
            <p style="text-align: center;">
                No record(s) found !
            </p>
        </NoRecordsTemplate>
        <Columns>
            <telerik:GridBoundColumn DataField="VehiclesID" UniqueName="VehiclesID" HeaderText="#" Visible="false">
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn DataField="LicensePlate" UniqueName="LicensePlate" HeaderText="License Plate"></telerik:GridBoundColumn>
            <telerik:GridBoundColumn UniqueName="State" HeaderText="State" DataField="State"></telerik:GridBoundColumn>                               
            <telerik:GridTemplateColumn HeaderText="Action" ItemStyle-Width="10%" HeaderStyle-HorizontalAlign="Center"
                ItemStyle-HorizontalAlign="Center" UniqueName="Action">
                <ItemTemplate>
                    <asp:ImageButton AlternateText="ContextMenu" ID="ContextMenuButton" ImageUrl="~/Images/chart-expended-arrow-90.png"
                        runat="server" />
                </ItemTemplate>
            </telerik:GridTemplateColumn>
        </Columns>
        <EditFormSettings EditFormType="Template">
            <FormTemplate>
                <div class="tableInside">
                    <div class="tableW">
                        <div class="trW" style="display:none;">
                            <div class="tdColumn-left">
                                Vehicle ID
                            </div>
                            <div class="tdColumn-right">
                                <asp:Label runat="server" ID="lblVehiclesID" Text='<%# Eval("VehiclesID") %>'></asp:Label>                                               
                            </div>                                                  
                        </div>
                        <div class="trW">
                            <div class="tdColumn-left">
                                License Plate
                            </div>
                            <div class="tdColumn-right">
                                <telerik:RadTextBox ID="txtLicensePlate" Text='<%# Eval("LicensePlate") %>' runat="server"></telerik:RadTextBox>                                
                            </div>                                                  
                        </div>                                          
                    </div>
                    <div class="tableW">
                        <div class="trW">
                            <div class="tdColumn-left">
                                License Plate
                            </div>
                            <div class="tdColumn-right">
                            </div>                                                                                              
                        </div>                                       
                    </div>
                    <div class="trRow" style="text-align: center; margin-top: 5px;">
                        <telerik:RadButton ID="btnCancelVehicles" Text="Cancel" AutoPostBack="false" OnClientClicked="btnCancelVehicles_OnClientClicked" runat="server" CssClass="black" Icon-PrimaryIconUrl="~/Images/cancel1.png">
                        </telerik:RadButton>
                           
                        <telerik:RadButton ID="btnSaveVehicles" runat="server" Text="Save" CausesValidation="true" ValidationGroup="AllSave" CssClass="save" AutoPostBack="true" OnClientClicked="btnSaveVehicles_OnClientClicked"
                         
                        Icon-PrimaryIconCssClass="iconSave">
                        </telerik:RadButton>
                    </div>       
                </div>
            </FormTemplate>
        </EditFormSettings>
    </MasterTableView>
</telerik:RadGrid>                               
Here are the scripts (javascripts) below used to fire

function btnSaveVehicles_OnClientClicked(sender, eventArgs) {
           var _tempGridMaster = $find("<%=radVehicles.ClientID %>").get_masterTableView();               
 
           var _lblConvertVehiclesVal = $("#<%=lblVehiclesItemIndex.ClientID %>").html();               
 
           if (_lblConvertVehiclesVal != "") {
               ConvertVehiclesRowIndex = parseInt(_lblConvertVehiclesVal);
           }
           else {
               ConvertVehiclesRowIndex = -1;
           }
 
           if (Page_IsValid) {
               if (ConvertVehiclesRowIndex == -1) {
                   _tempGridMaster.fireCommand("PerformInsert", "");
               }
               else {
                   _tempGridMaster.fireCommand("Update", ConvertVehiclesRowIndex);
               }
           }
       }


here is my ItemCommand handler

protected void Vehicles_OnItemCommand(object sender, GridCommandEventArgs e)
    {
        switch (e.CommandName)
        {
            case "Edit":
                lblConvertVehiclesItemIndex.InnerHtml = e.Item.ItemIndex.ToString();                   
                e.Item.OwnerTableView.IsItemInserted = false;
                BindConvertVehiclesData();
                break;
            case "InitInsert":
                radConvertVehicles.MasterTableView.ClearEditItems();
                BindConvertVehiclesData();
                break;
            case "Cancel":
                e.Item.OwnerTableView.IsItemInserted = false;
                BindConvertVehiclesData();
                break;
            case "PerformInsert":

all the above commands are invoked using client side fireCommand and all "Edit", "InitInsert", and "Cancel" are working but when firing "PerformInsert" I am unable to get the Commandname in e.CommandName as a result my switch is not working.
Deyan Enchev
Telerik team
 answered on 18 Jul 2013
2 answers
88 views
So, I've upgraded to the latest Telerik (2013_2_0611) to make use of RenderMode on RadWindows.

Previously, I'd gotten help with position the RadWindow here: http://www.telerik.com/community/forums/aspnet-ajax/window/radwindow-not-respecting-top-and-left.aspx - this was before the update.

After the update, I've discovered that if I set RenderMode=Lightweight, it seems to take the size of the window and add it to Top and Left, so I get windows that are ever moving.  If AutoSize=True, it stays pretty much in the same area after a while...  If I set it to False, it is ever going in a diagonal direction away from my button.

I've got a sample project to show what I mean, but I apparently can't attach it to a forum post, so here's the code.  WebForm1.aspx works as I want, and WebForm2.aspx highlights the bad behavior.  Is this expected behavior, or a known issue?

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="WebForm1.aspx.vb" Inherits="RadWindowHijinks.WebForm1" %>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<%@ Register Assembly="System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
    Namespace="System.Web.UI" TagPrefix="asp" %>
 
<head runat="server">
    <title>Fun with RadWindows!</title>
    <telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">
        <script type="text/javascript">
            //Global Variables
            var lastOpenedWindow;
 
            function pageLoad() {
                $addHandler(document, "click", onClickHandler);
            }
 
            function MenuOpenWindow(sender, eventArgs) {
                var oWindow;
 
                //Closes the last window opened
                if (lastOpenedWindow) {
                    lastOpenedWindow.close();
                    lastOpenedWindow = null;
                }
 
                if (eventArgs.get_item().get_value() == "EmpProj") {
                    oWindow = $find("<%=winEmpProj.ClientID%>");
                    oWindow.show();
                    if (oWindow.get_offsetElementID()) {
                        offsetElementBounds = $telerik.getBounds($get(oWindow.get_offsetElementID()));
                        oWindow.moveTo(offsetElementBounds.x + oWindow.get_left(), offsetElementBounds.y + oWindow.get_top());
                    }
                    lastOpenedWindow = oWindow;
                    return false;
                }
            }
 
            function onClickHandler(e) {
                var targedNodeName = e.target;
 
                if (lastOpenedWindow) {
                    // If the RadWindow is clicked then do nothing ;
                    if ($telerik.isMouseOverElementEx(lastOpenedWindow.get_popupElement(), e)) return;
 
                    lastOpenedWindow.close();
                    lastOpenedWindow = null;
                }
            }
        </script>
    </telerik:RadScriptBlock>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <telerik:RadScriptManager ID="RadScriptManager1" Runat="server">
        </telerik:RadScriptManager>
        <div id="divEmpMenu" style="width: 6%; display: inline-block;">
            <telerik:RadMenu ID="menuCheck" runat="server" flow="Vertical" OnClientItemClicked="MenuOpenWindow" Width="100%">
                <Items>
                  <telerik:RadMenuItem ImageUrl="../Images/button.jpg" Value="EmpProj" />
                </Items>
            </telerik:RadMenu>
            <telerik:RadWindow id="winEmpProj" runat="server" Top="0" Left="0" Style="z-index: 8000" EnableEmbeddedSkins="false" OffsetElementID="divEmpHeader"
                ShowContentDuringLoad="false" VisibleStatusbar="false" VisibleTitlebar="false" AutoSize="true">
                <ContentTemplate>
                    <div id="divProjListList" runat="server" style="width: 400px; background-color: Gray;">
                        <div>Projects</div>
                        <div style="width: 400px">
                            <p>List of Projects and fun times.</p>
                            <p>More lists, more fun times.</p>
                            <p>Weee lists!</p>
                        </div>
                    </div>
                </ContentTemplate>
            </telerik:RadWindow>
        </div>
          
        <div id="divEmpHeader" style="background-color: Teal; float: left; position: fixed; top: 100px; left: 200px;">
            <p>Clicking on the button will consistently bring the window around me.</p>
            <p>You have to click off the button to make me go away.</p>
            <p><a href="WebForm2.aspx">Click here to go to the broken page.</a></p>
        </div>
    </div>
    </form>
</body>
</html>
<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="WebForm2.aspx.vb" Inherits="RadWindowHijinks.WebForm2" %>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<%@ Register Assembly="System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
    Namespace="System.Web.UI" TagPrefix="asp" %>
 
<head id="Head1" runat="server">
    <title>Fun with RadWindows!</title>
    <telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">
        <script type="text/javascript">
            //Global Variables
            var lastOpenedWindow;
 
            function pageLoad() {
                $addHandler(document, "click", onClickHandler);
            }
 
            function MenuOpenWindow(sender, eventArgs) {
                var oWindow;
 
                //Closes the last window opened
                if (lastOpenedWindow) {
                    lastOpenedWindow.close();
                    lastOpenedWindow = null;
                }
 
                if (eventArgs.get_item().get_value() == "EmpProj") {
                    oWindow = $find("<%=winEmpProj.ClientID%>");
                    oWindow.show();
                    if (oWindow.get_offsetElementID()) {
                        offsetElementBounds = $telerik.getBounds($get(oWindow.get_offsetElementID()));
                        oWindow.moveTo(offsetElementBounds.x + oWindow.get_left(), offsetElementBounds.y + oWindow.get_top());
                    }
                    lastOpenedWindow = oWindow;
                    return false;
                }
 
                if (eventArgs.get_item().get_value() == "Test2") {
                    oWindow = $find("<%=winTest2.ClientID%>");
                    oWindow.show();
                    if (oWindow.get_offsetElementID()) {
                        offsetElementBounds = $telerik.getBounds($get(oWindow.get_offsetElementID()));
                        oWindow.moveTo(offsetElementBounds.x + oWindow.get_left(), offsetElementBounds.y + oWindow.get_top());
                    }
                    lastOpenedWindow = oWindow;
                    return false;
                }
            }
 
            function onClickHandler(e) {
                var targedNodeName = e.target;
 
                if (lastOpenedWindow) {
                    // If the RadWindow is clicked then do nothing ;
                    if ($telerik.isMouseOverElementEx(lastOpenedWindow.get_popupElement(), e)) return;
 
                    lastOpenedWindow.close();
                    lastOpenedWindow = null;
                }
            }
        </script>
    </telerik:RadScriptBlock>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <telerik:RadScriptManager ID="RadScriptManager1" Runat="server">
        </telerik:RadScriptManager>
        <div id="divEmpMenu" style="width: 6%; display: inline-block;">
            <telerik:RadMenu ID="menuCheck" runat="server" flow="Vertical" OnClientItemClicked="MenuOpenWindow" Width="100%">
                <Items>
                  <telerik:RadMenuItem ImageUrl="../Images/button.jpg" Value="EmpProj" ToolTip="AutoSize=true" />
                  <telerik:RadMenuItem ImageUrl="../Images/button2.jpg" Value="Test2" ToolTip="AutoSize=false" />
                </Items>
            </telerik:RadMenu>
            <telerik:RadWindow id="winEmpProj" runat="server" Top="0" Left="0" Style="z-index: 8000" EnableEmbeddedSkins="false" OffsetElementID="divEmpHeader"
                ShowContentDuringLoad="false" VisibleStatusbar="false" VisibleTitlebar="false" AutoSize="true" RenderMode="Lightweight">
                <ContentTemplate>
                    <div id="divProjListList" runat="server" style="width: 400px; background-color: Gray;">
                        <div>Projects</div>
                        <div style="width: 400px">
                            <p>List of Projects and fun times.</p>
                            <p>More lists, more fun times.</p>
                            <p>Weee lists!</p>
                        </div>
                    </div>
                </ContentTemplate>
            </telerik:RadWindow>
            <telerik:RadWindow id="winTest2" runat="server" Top="0" Left="0" Style="z-index: 8000" EnableEmbeddedSkins="false" OffsetElementID="divEmpHeader"
                ShowContentDuringLoad="false" VisibleStatusbar="false" VisibleTitlebar="false" AutoSize="false" RenderMode="Lightweight">
                <ContentTemplate>
                    <div id="div1" runat="server" style="width: 400px; background-color: Gray;">
                        <div>Projects</div>
                        <div style="width: 400px">
                            <p>List of Projects and fun times.</p>
                            <p>More lists, more fun times.</p>
                            <p>Weee lists!</p>
                        </div>
                    </div>
                </ContentTemplate>
            </telerik:RadWindow>
        </div>
          
        <div id="divEmpHeader" style="background-color: Teal; float: left; position: fixed; top: 100px; left: 200px;">
            <p>Now, you can continually click on the button, and the window ever moves.  It will move even if you click off the button and back on.</p>
            <p>The first button, it'll eventually start hitting the same spots in a circlar kinda pattern.</p>
            <p>The second button, the window will go in a diagonal downward placement.</p>
        </div>
    </div>
    </form>
</body>
</html>
Amanda
Top achievements
Rank 1
Iron
 answered on 18 Jul 2013
1 answer
129 views
When entering a decimal value into a RadNumericTextbox, if there are no values greater than 0 to the left of the decimal point, and the first non-zero digit is seven digits to the right of the decimal point, the number will be displayed in the field in scientific notation on focus. 0.0000007 will be displayed as 7e-7 if the user enters the number, selects outside the textbox, and then selects the textbox again. I would like it to remain in standard decimal notation.
Zachary
Top achievements
Rank 1
 answered on 18 Jul 2013
1 answer
147 views
Hi

I have created a custom skin based on the embedded Windows7 skin (it is only the colors which have changed) which is applied using an ASP.NET theme. In general this works well but I have found one area which is causing problems. The generic CSS rules (i.e. those which are not skin specific) are still taken from the skins DLL (i.e. they come from ...Telerik.Web.UI.WebResource.axd) but they are loaded after the skin specific styles fromn the ASP.NET theme folder. As a result there are situations where a skin specific style designed to override a non-skin specific style does not work.

As an example consider the Calendar control. The non-skin specific calendar CSS file includes the following rule which adds a border to the cells used for each day:

  .RadCalendar .rcRow td {
    border-style: solid;
    border-width: 1px;
    padding: 0;
    text-align: right;
    vertical-align: middle; }

The custom skin calendar CSS file includes the following rule which removes the border:

.RadCalendar_CXTest .rcRow td {
 width: 26px;
 border: 0;
 padding: 0 0 1px 1px;
}

Since these two rules have the same specificity the ordering is important. Unfortunately the non-skin specific file is loaded after the skin specific file and so the non-skin specific rule takes precedence and the calendar days end up with borders.

Is there any way to avoid this?

Thanks

Graham


Venelin
Telerik team
 answered on 18 Jul 2013
3 answers
161 views
hello,
I would like to manage code behind that when I change the display of rows of the grid, for example from 20 to 30 or 50 lines, automatically changes the height of the grid. I set the default 15 lines and a height of 485px. How can I do?

this is the code that I use when I change the page size

Protected Sub RadGrid1_PageSizeChanged(sender As Object, e As GridPageSizeChangedEventArgs) Handles RadGrid1.PageSizeChanged
    RadGrid1.DataSource = read.GetSchedineData(1, "15-07-2013")
    RadGrid1.Rebind()
End Sub

Jayesh Goyani
Top achievements
Rank 2
 answered on 18 Jul 2013
1 answer
82 views
Hi

Any possibility to make the radtreeview to appear like radpanelbar especially its collapse and expand operations.

Thanks
Karl
Princy
Top achievements
Rank 2
 answered on 18 Jul 2013
3 answers
325 views
Is there an example anywhere that shows how to add new items on the client side to the dropdown list?

The documentation seems to be lacking any examples really for the dropdowns client side.
Nencho
Telerik team
 answered on 18 Jul 2013
5 answers
154 views
Hi, I notice that the $telerik.getLocation() returns wrong results. I am using it to get the position of an element on the page so I can put another element at the same position on the page over it. So I am using $telerik.getLocation() et $telerik.setLocation() but the returned location is few pixels less than the real position (as I remember is 4 pixels less in x and y).

When I run my application locally in Visual Studio 2012 using IE8, everything is fine but when I run it from an IIS located on server then like I said I am few pixels away (same browser). I found a workaround by using jquery instead to get the location with:

$telerik.$(element).offset().left; // .top

I still use $telerik.setLocation() to set the position which work.

PS: $telerik.getBounds() have the same problem with x and y.
Danail Vasilev
Telerik team
 answered on 18 Jul 2013
Narrow your results
Selected tags
Tags
+? more
Top users last month
Chester
Top achievements
Rank 1
Iron
Simon
Top achievements
Rank 1
Iron
Douglas
Top achievements
Rank 2
Iron
Iron
SUNIL
Top achievements
Rank 3
Iron
Iron
Iron
Marco
Top achievements
Rank 3
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Chester
Top achievements
Rank 1
Iron
Simon
Top achievements
Rank 1
Iron
Douglas
Top achievements
Rank 2
Iron
Iron
SUNIL
Top achievements
Rank 3
Iron
Iron
Iron
Marco
Top achievements
Rank 3
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?