Make checkbox un-movable in Design mode

2 posts, 0 answers
  1. Sameer
    Sameer avatar
    3 posts
    Member since:
    Jun 2010

    Posted 03 May 2013 Link to this post


    We use RadEditors to support drag and drop of pre-configured HTML that contains combination of text and few HTML controls like checkboxes and Dropdown lists. The Radeditor has to be in design mode as the user should be able to change/add any text even after the pre-configured text is dragged in. However, this creates an issue when checking/unchecking of checkboxes or even selecting values from drop down list. Users have to click multiple times to be able to select a value.

    Is it possible to make the HTML controls not moveable/selectable in design mode so it would be easy to check/uncheck or select a value?
  2. Nikolay
    Nikolay avatar
    94 posts

    Posted 08 May 2013 Link to this post


    You can use the RadEditor's OnClientLoad event to get the HTML controls within the content area and add them attributes e.g. unselectable="on" and/or attach events handlers. Here is a sample code:
    <telerik:RadEditor ID="RadEditor1" runat="server" OnClientLoad="OnClientLoad"></telerik:RadEditor>
    <script type="text/javascript">
        function OnClientLoad(editor, args)
            var checkboxes = $telerik.$('input[type=checkbox]', editor.get_contentArea());
            checkboxes.attr('unselectable', 'on');
            checkboxes.on('mousedown.RadEditorCustomMousedown', function(event)
                if (editor.get_mode() == Telerik.Web.UI.EditModes.Design)
                    var checkbox =;
                    // check or unckeck the checkbox here

    I hope this will help you to achieve the required functionality.

    Best regards,
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Back to Top