Non-Editable Area not working on Chrome

[Dan]

If you go to this page:

 

https://demos.telerik.com/aspnet-ajax/editor/examples/overview/defaultcs.aspx

And then go to the HTML tab and pasted this code in:

 

<div style="border: red 1px solid;" contenteditable="false" unselectable="on">
Non Editable AREA
<div style="border: green 1px solid;" contenteditable="true" unselectable="off">
<!--Content name="info" -->
Editable REGION...
<!--/Content -->
</div>
Non Editable AREA
</div>

 

Which is from the documentation page:

 

https://docs.telerik.com/devtools/aspnet-ajax/controls/editor/managing-content/editable-and-non-editable-areas

 

If you go back to the design tab, you are unable to type anything in the editable area. This works fine in the legacy edge (non-Chromium).

 

Also interesting is that you can delete things in the non-editable area.

[Rumen]

Hi Dan,

Thank you for reporting this problem!

Until we are investigating it, you may want to try some of the alternative ideas:

https://www.telerik.com/forums/non-editable-areas-in-firefox#aF52r2e6hEGzfZEiIg25JQ

and

<telerik:RadEditor runat="server" EnableImmutableElements="true" ID="NewsEditor">
    <Content>
        <p style="text-align: left;" contenteditable="false">
         Test
          <span style="font-family: Georgia;">​MyTest<span style="font-size: 12px;">​AAAAAA<br />
          <br />
          </span>
             </p>
       <div contenteditable="false" unselectable="on">Immutable container</div>
        <table>
            <tbody>
                <tr>
                    <td><div contenteditable="false" unselectable="on">Immutable cell</div></td>
                    <td> </td>
                    <td> </td>
                </tr>
                <tr>
                    <td> </td>
                    <td> </td>
                    <td> </td>
                </tr>
                <tr>
                    <td> </td>
                    <td> </td>
                    <td> </td>
                </tr>
                <tr>
                    <td> </td>
                    <td> </td>
                    <td><div contenteditable="false" unselectable="on">Immutable cell</div></td>
                </tr>
            </tbody>
        </table>
 
    </Content>
</telerik:RadEditor>

Regards,
Rumen
Progress Telerik