Drag RadToolBarButton Text and Drop in RadTextBox

2 posts, 0 answers
  1. Fred
    Fred avatar
    7 posts
    Member since:
    Jan 2015

    Posted 10 Apr 2015 Link to this post

    I can drag a RadToolBarButton and drop it into a RadTextBox and have it drop where I want it to go without any code.

     I need to customize the text that is dropped.  By default, the NaviageUrl value is the text which is dropped into the RadTextBox.  How can I specify what the drop text is?

    Here is my ASCX code.

     

    <%@ Control Language="C#" AutoEventWireup="true" CodeBehind="TSQLParamForm.ascx.cs" Inherits="WebApp.Controls.Forms.TSQLParamForm" %>
    <telerik:RadAjaxManagerProxy ID="RadAjaxManagerProxy1" runat="server">
        <AjaxSettings>

            <telerik:AjaxSetting AjaxControlID="formulaTB">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="formulaTB" UpdatePanelCssClass="" />
                    <telerik:AjaxUpdatedControl ControlID="AttributeToolBar" UpdatePanelCssClass="" />
                </UpdatedControls>
            </telerik:AjaxSetting>
            <telerik:AjaxSetting AjaxControlID="AttributeToolBar">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="formulaTB" UpdatePanelCssClass="" />
                    <telerik:AjaxUpdatedControl ControlID="AttributeToolBar" UpdatePanelCssClass="" />
                </UpdatedControls>
            </telerik:AjaxSetting>

        </AjaxSettings>
    </telerik:RadAjaxManagerProxy>


    <telerik:RadTextBox runat="server" ID="formulaTB" Rows="5" MaxLength="4000" Width="100%" InputType="Text" RenderMode="Lightweight" TextMode="MultiLine">
    </telerik:RadTextBox>
    <telerik:RadToolBar runat="server" ID="AttributeToolBar" Width="100%" SingleClick="None">
        <Items>
            <telerik:RadToolBarButton runat="server" Text="@Attr1" Value="@Attr1" NavigateUrl="@Attr1">
            </telerik:RadToolBarButton>
            <telerik:RadToolBarButton runat="server" Text="@Attr2" Value="@Attr2" NavigateUrl="@Attr2">
            </telerik:RadToolBarButton>
        </Items>
    </telerik:RadToolBar>

     

     

  2.
  3. Ivan Danchev
    Admin
    Ivan Danchev avatar
    1568 posts

    Posted 13 Apr 2015 Link to this post

    Hello,

    You can access the RadToolBarButton's property values in the RadTextBox's OnValueChanged event handler. To do that you need to add an attribute to the buttons, which you will then use to get a reference to the dragged button. Please review the following code, which demonstrates this approach by changing the text in the RadTextBox with the dragged button's Text property value:
    <telerik:RadToolBar ID="RadToolBar1" runat="server">
        <Items>
            <telerik:RadToolBarDropDown runat="server" ToolTip="Show/Hide" Text="Interior">
                <Buttons>
                    <telerik:RadToolBarButton runat="server" Text="Walls" CustomAttribute="http://www.google.com/" NavigateUrl="http://www.google.com" />
                    <telerik:RadToolBarButton runat="server" Text="Floor" CustomAttribute="http://www.microsoft.com/" NavigateUrl="http://www.microsoft.com" />
                </Buttons>
            </telerik:RadToolBarDropDown>
        </Items>
     
    </telerik:RadToolBar>
     
    <telerik:RadTextBox ID="TextBox1" runat="server">
        <ClientEvents OnValueChanged="valueChanged" />
    </telerik:RadTextBox>

    function valueChanged(sender, eventArgs) {
     
        var textboxValue = eventArgs.get_newValue();
        var toolBar = $find("<%=RadToolBar1.ClientID %>");
     
        var button = toolBar.findItemByAttribute("CustomAttribute", textboxValue);
        var buttonText = button.get_text();
     
        sender.set_textBoxValue(buttonText);
    }

    Note the values of the added attributes copy those of the NavigateUrl properties and have an extra "/" at the end.

    Regards,
    Ivan Danchev
    Telerik
     

    See What's Next in App Development. Register for TelerikNEXT.

     
Back to Top