This is a migrated thread and some comments may be shown as answers.

Using only program control for edit, table, span sizing not allowed

5 Answers 113 Views
Editor
This is a migrated thread and some comments may be shown as answers.
John
Top achievements
Rank 1
John asked on 05 Jan 2011, 11:27 PM

I have a mode in application that uses radeditor where a certain role, call it “user” has no ability to modify content other than through 3 custom “note annotation” buttons on custom tool bar and in the context menu (add note, delete note, modify note).  I figure there are two ways of doing this with radeditor;

1.       Use Design mode and when the ‘user role’ is detected go into design mode remove all the tool bars except the one that has the 3 annotation buttons remove all context menus except the 3 annotation buttons.  I can disable content by catching all keystokes (that I want to catch) in a client side key event handler.  (This mode is the one I’m currently coding to at the moment)

Problems with this method:

1.       I have some bordered colored span tags that the “user role” can grab with the mouse and move around, which I would like to disable.

2.       Some content is in tables and the “user role” can size the borders, which I would like to disable.

3.       All tables even with invisible borders can have their border sized modified by the “user role”

2.       Use Preview mode.  I can enable the three button based on this support article http://www.telerik.com/support/kb/aspnet-ajax/editor/enabling-print-button-in-preview-mode.aspx .  Here there is not the problems listed in #1 but there are other problems introduced;

Problems with this method (so far)

1.       Some html document elements don’t work, like getElementById which is essential for inserting annotations into document

2.       It does not appear that the editor content can be modified by client side programming.

3.       Cursor selection is disabled

If I could overcome the problems for either 1 or 2 I think I could fulfill my “user role” requirement with limited user editing via client/server program control

Thank you for any thoughts on the issue.

5 Answers, 1 is accepted

Sort by
0
Dobromir
Telerik team
answered on 10 Jan 2011, 01:29 PM
Hi John,

I would recommend you using the first approach to implement the required functionality, because the client-side API of the editor does not offer applying modifications to the content in Preview Mode.

Regarding the problems that you experience:
  1. You can disable the selection of specific HTML elements by setting UNSELECTABLE="on" attribute to them (for FireFox you need to use style="-moz-user-select: none;"). In the following help article you can find how to define editable and non-editable areas in RadEditor:
    Editable and Non-editable Areas
  2. I am not quite sure I understand what do you mean by "user role can size the borders". If the problem is that the user can modify the table using the RadEditor's Properties Inspector system module (see the attached screenshot), you can disable it using the approaches provided in this help article. If this is not the case, could you please describe in more details what is the exact issue, screenshots visualizing the issue will be of great help.
  3. Same as 2.

Please let us know if this helps.
Best wishes,
Dobromir
the Telerik team
Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
0
John
Top achievements
Rank 1
answered on 11 Jan 2011, 07:58 PM
Thanks so much for your reply, it was useful, in that I can fix tables in "design mode" but I need to ask some further questions;

Referring to point 3.
Whether un-selectable, or un-editable is enabled I still get the "design" border around tables even though border width is set to 0.  I realize this is a "design mode" feature, but would like to disable it in certain scenarios.  That is if the border width is 0, then don't even show the dotted line around the table.  See attached image.

Thanks,

John
0
Rumen
Telerik team
answered on 12 Jan 2011, 09:13 AM
Hello John,

You can hide manually the dashed table border by pressing the Show / Hide Table Border button. You can completely disable this feature by setting the ContentAreaCssFile property to point to your own css file which contains only the following classes:

.RadEWrongWord
{
background-color: yellow;
}
.RadEDomMouseOver
{
background-color:#ffffcc;
}
body
{
padding:3px;
background-image: none;
margin: 0px;
text-align: left;
scrollbar-face-color: #E9E9E9;
scrollbar-highlight-color: #FFFFFF;
scrollbar-shadow-color: #E9E9E9;
scrollbar-3dlight-color: #DBDBDB;
scrollbar-arrow-color: #787878;
scrollbar-track-color: #F5F5F5;
scrollbar-darkshadow-color: #AEAEAE;
word-wrap: break-word;
}
form
{
background-color:#efefef;
border:1px dashed #555555;
}

The following classes were excluded because they apply the default table dashed border to the content area:

table
{
BORDER-RIGHT: #999999 1px dashed;
border-bottom: #999999 1px dashed;
}
table td
{
PADDING: 1px;
border-top: #999999 1px dashed;
BORDER-LEFT: #999999 1px dashed;
}
table th
{
PADDING: 1px;
border-top: #000000 1px dashed;
BORDER-LEFT: #000000 1px dashed;
}

Kind regards,
Rumen
the Telerik team
Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
0
John
Top achievements
Rank 1
answered on 13 Jan 2011, 08:10 PM
Thank you!  That seems to have done the trick. 

One question though; How does ContentAreaCssFile property work in relation to the Editor.css file in the skins directory.  Does the file specified in ContentAreaCssFile replace functionality of editor.css or does it override it?  Or are they not related?

Just wondering what side effects I might expect if something is getting overridden that was there before.

Thanks in advance

John

0
Dobromir
Telerik team
answered on 18 Jan 2011, 01:33 PM
Hi John,

Having a ContentAreaCssFile set should not affect the RadEditor's appearance, except for its content area. Both files are not related and Editor.css file does not contain any decorations related to the RadEditor's content area.

The CSS file set as a value to the ContentAreaCssFile property will be loaded inside the RadEditor's content area only. It will affect only the content of the editor and not the whole control, while the Editor.css file from Skins folder is loaded on the page where RadEditor resides and contains decorations regarding the entire control.

Kind regards,
Dobromir
the Telerik team
Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
Tags
Editor
Asked by
John
Top achievements
Rank 1
Answers by
Dobromir
Telerik team
John
Top achievements
Rank 1
Rumen
Telerik team
Share this question
or