Apply Formatting to Selection of Multiple Table Cells

4 posts, 0 answers
  1. Andrew
    Andrew avatar
    4 posts
    Member since:
    May 2016

    Posted 30 May Link to this post

    Hello,

    I have a button in the Radeditor that calls a custom command.  The command sets the bottom border of a table cell by adjusting the style attribute of a <td> tag.  It works fine when the cursor is in the target cell.  However, when I select multiple cells in the table, the border is only applied to the last cell I select.  I suppose this is behaving as it should (setting the style of the last active cell), but I am wondering how I would approach adjusting the code to handle multiple cell selects?  I had a look at the getSelection and getSelectionHtml methods and wasn't able to find a working solution.  Any help would be appreciated.  Here's my existing code snippet:

                Telerik.Web.UI.Editor.CommandList["DoubleBottomBorder"] = function(commandName, editor, args) {
                            var command = new Telerik.Web.UI.Editor.GenericCommand(commandName, editor.get_contentWindow(), editor);
                            var elem = editor.getSelectedElement();
                            elem.style.borderBottom = "3px double #000000";
                            editor.executeCommand(command);                      
                };

    Regards,

    Andrew

  2. Ianko
    Admin
    Ianko avatar
    1535 posts

    Posted 02 Jun Link to this post

    Hello Andrew,

    getSelectedElement will never return you a proper result that can be traverse-able so to apply the needed changes.

    You should rather use the browser's Range (http://docs.telerik.com/devtools/aspnet-ajax/controls/editor/client-side-programming/methods/selection/getrange). You can traverse it and apply the changes to all selected TDs. 

    Regards,
    Ianko
    Telerik
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Andrew
    Andrew avatar
    4 posts
    Member since:
    May 2016

    Posted 03 Jun in reply to Ianko Link to this post

    Hi Ianko,

    What you explain makes sense.  I have tried using the getRange() method but it only seems to return the location of the cursor (a single point, nothing to traverse).  Do I need to use the 'true' argument?  If so it seems I'm stuck because we are using a Telerik version from 2011.

    Regards,

    Andrew

  5. Ianko
    Admin
    Ianko avatar
    1535 posts

    Posted 06 Jun Link to this post

    Hi Andrew,

    Basically, getRange returns the browser range, which is a native functionality. Therefore, I suggest you reading more about it in the MDN documentation (or MSDN) and find out how to use it for your case—https://developer.mozilla.org/en-US/docs/Web/API/Range

    Regards,
    Ianko
    Telerik
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
Back to Top