Telerik Forums
UI for ASP.NET AJAX Forum
10 answers
158 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
284 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
97 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
137 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
154 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
174 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
87 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
342 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
173 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
1 answer
112 views
Hi,
I have a user control in a grid which I want to update via ajax.
Scenario: I click on this link which is part of a user control. A pop up window opens up. I enter some details and save it and close pop up. Since the pop is the detailed version of the user control, now, as soon as the link  closes I have a way to make the ajax call and identify the user control and update itself from Db. Right now I can get reference of the control and update it but it does not refresh on UI.Is there anything I am doing wrong here is relevant code..
AjaxManager_AjaxRequest gets called and reference to user control as well but it does not refresh on UI. in code it does get updated by grabbing new values from database. Any ideas..?
Maria Ilieva
Telerik team
 answered on 18 Jul 2013
Narrow your results
Selected tags
Tags
+? more
Top users last month
Simon
Top achievements
Rank 2
Iron
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Marco
Top achievements
Rank 4
Iron
Iron
Iron
Grant
Top achievements
Rank 3
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Simon
Top achievements
Rank 2
Iron
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Marco
Top achievements
Rank 4
Iron
Iron
Iron
Grant
Top achievements
Rank 3
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?