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

In design mode, paragraphs have drag handles

2 Answers 33 Views
Editor
This is a migrated thread and some comments may be shown as answers.
Mark Davis
Top achievements
Rank 1
Mark Davis asked on 08 Jan 2009, 03:13 AM
I'm seeing an issue with the editor, where I am editing content that has text inside <P> tags and I can't edit the text. This is because the paragraph has drag handles, and the cursor displays the 'move' icon. This is in IE 7.

We have switched to setting the NewLineBR property to true (was set to false to fix another issue) but some of our content is still wrapped with <P> tags. Is there a way to turn off this behavior?

I can send code/screenshot if you need more information.

2 Answers, 1 is accepted

Sort by
0
Accepted
Tervel
Telerik team
answered on 10 Jan 2009, 01:41 PM
Hi Mark,

The problem is IE specific and comes from the hasLayout concept in IE.
Here are two URLs that discuss hasLayout.

http://msdn.microsoft.com/en-us/library/bb250481.aspx
http://www.satzansatz.de/cssd/onhavinglayout.html

The issue comes from the fact that your paragraphs have some CSS formatting that causes them to acquire layout.
I prepared some sample code to demonstrate the concept:
          <script> 
              function OnClientSelectionChange(editor, args) 
              { 
                  var elem = editor.getSelectedElement(); 
                  if (elem.currentStyle && elem.currentStyle.hasLayout) 
                  { 
                    alert("Well, in IE to avoid having handles, the element MUST NOT have layout. However, it is unclear how this can be achieved"); 
                  } 
              }            
              </script> 
               
<telerik:radeditor runat="server"   
  OnClientSelectionChange="OnClientSelectionChange"              
  ID="RadEditor1"                
>                                                  
    <Content>                  
        <P>Some test content 1</P> 
        <style="background-color:pink;">Some test content 2</P>                  
    <style="background-color:yellow;zoom:1;">Some test content 3 </P> 
    </Content> 
 </telerik:radeditor> 

The third paragraph has layout (because of the zoom:1 css setting) - so clicking on the paragraph will trigger the alert from the OnClientSelectionChange handler.

In your case, your paragraph elements have some css (perhaps width or height or border) that causes them to acquire layout. Unfortunately, the layout concept is essential to IE - and once an element has gained layout, the only way to lose it is to remove those CSS settings.

It is a Catch 22 situation - and we are not aware of any solution that will a) keep desired CSS settings b) not exhibit the behavior you describe - since it is due to hasLayout.

My only suggestion is, in case you are able to contact someone from the IE team - to please do so. If they are able to provide more insight how to work around the problem it would be great.

Best regards,
Tervel
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
Mark Davis
Top achievements
Rank 1
answered on 15 Jan 2009, 07:25 PM
Thanks for the answer!
Tags
Editor
Asked by
Mark Davis
Top achievements
Rank 1
Answers by
Tervel
Telerik team
Mark Davis
Top achievements
Rank 1
Share this question
or