Won't Fix
Last Updated: 18 Apr 2022 14:48 by ADMIN
ADMIN
Rumen
Created on: 16 Nov 2016 08:17
Category: Editor
Type: Feature Request
0
Fix Image floats to other element on replacing it with pasteHtml in IE11 browser
In order to replace the image we use the 'pasteHtml()' API method (http://docs.telerik.com/devtools/aspnet-ajax/controls/editor/client-side-programming/methods/pastehtml). Unfortunately, we have faced the issue in the latest version of Telerik RadEditor (2016.3.1027.45). 


If parent 'div' has "float:left" style settings, the 'pasteHtml()' API method inserts a new image beyond the parent 'div' element. The issue is reproducible in IE11, and it is not reproducible on in the FF and Chrome, Edge and IE10.


Steps to reproduce:
1. Open the demo page http://demos.telerik.com/aspnet-ajax/editor/examples/overview/defaultcs.aspx
2. Switch to the 'HTML' mode of the RTE and replace all existing HTML content with the following HTML snippet:
***
<div style="float: left;">
<img alt="" style="margin: 0px 30px 30px 0px; width: 200px; float: left;" src="../../images/top_image.png" />
</div>
***
3. Switch to the 'Design' mode of the RTE and click once on the image;
4. Open the browser console (F12) and execute the following API code in the console:
$telerik.radControls[11].pasteHtml('<img alt="" src="/aspnet-ajax/Editor/images/UserDir/Marketing/Tokyo.png" />')

Actual Result:
A new image is inserted beyond the parent 'div' element.
***
<div style="float: left;">
</div>
<img alt="" src="/aspnet-ajax/Editor/images/UserDir/Marketing/Tokyo.png" />
***

Expected result:
A new image is inserted into the parent 'div' element.
***
<div style="float: left;">
<img alt="" src="/aspnet-ajax/Editor/images/UserDir/Marketing/Tokyo.png" />
</div>
***

Here is the screencast:
http://screencast.com/t/PQOQeKsvViRK


0 comments