Remove a resizer from HTML code (unwrapping the resizable element)
I'm working with a WYSIWYG editor, using the HTML5 contenteditable feature.
In editable DIVs, the user enters text, images, videos, ...
After an image insertion, we want to give the user the ability to resize the image. That's why the Ext.resizer.Resizer seems the perfect solution.
But when the user completes the editing of editable DIVs, and submit the content of these areas, we want the resizer HTML code to be removed, so as the IMG tag only remains (with only original attributes, plus CSS width and height, and nothing more such as CSS 'position').
I'm really disappointed, has it seems there is no method in the resizer to do that! I wonder what is the use case this resizer responds to if it cannot be removed once the wrapped element has been resized?
Thanks in advance for your help!
Haven't tried it, but Resizer has a disable method (undocumented) that disables its drag tracker - or so it would seem looking at the source.
... don't know why that's undocumented.
Thanks for your answer.
I had a look at the disable method indeed, it does what it suggests, the HTML code is not removed unfortunately.
I think the only way to do what I want is to apply the resizer on an empty layer, outside the editable content, set the position of this layer manually over the resizable element, listen to 'resize' events, and synchronize the element size with the resizer size.
Thus, at least, the resizer HTML code will not be embedded in the editable content.
Tags for this Thread