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
3 Answers, 1 is accepted
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
Rank 1
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
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