medium-editor icon indicating copy to clipboard operation
medium-editor copied to clipboard

Not editable once Jquery ui sortable used

Open ramthenmala opened this issue 9 years ago • 13 comments

I am working on a drag and drop template generator. For text editor using Medium editor and for drag and drop using jquery ui js. But once the drag and drop initialized the editor wasn't working and content was n't editable. How to manage this?

ramthenmala avatar Jun 20 '16 11:06 ramthenmala

Please provide a JSBin / jsfiddle containing a set of reproducible steps.

j0k3r avatar Jun 20 '16 11:06 j0k3r

here we go!!!!

https://jsfiddle.net/e78ydow6/3/

ramthenmala avatar Jun 21 '16 12:06 ramthenmala

As far as I can see, it seems that sortable conflict with medium-editor..

j0k3r avatar Jun 21 '16 12:06 j0k3r

How can i solve this issue?? is there any way??

ramthenmala avatar Jun 21 '16 12:06 ramthenmala

I would look into whether you can have a drag handle for the sortable parts, instead of it being the entire element including the editable part. It seems like the sortable code is preventing click/focus from properly occurring into the editable <div>, so the user can't actually get focus and edit inside of a sortable.

If there's some way to make the editable <div> not be within the sortable (ie a drag handle that's a sibling of the <div>) you might have better luck. Without digging deeper into the sortable code, I'm not sure how it's preventing events from getting into medium-editor properly.

nmielnik avatar Jun 21 '16 13:06 nmielnik

i tried it in that way too. once jquery ui is initialized the medium editor is not working.

ramthenmala avatar Jun 22 '16 03:06 ramthenmala

@j0k3r Any hope from the supporting team? I am waiting for it.

ramthenmala avatar Jun 23 '16 04:06 ramthenmala

Unfortunately there isn't a support team, we're truly open source where the health of the editor relies heavily on help from its users.

Fixes to medium-editor generally come from folks like yourself, who run into issues, can verify when the issue is fixed, and are willing to share their work for the better of the editor!

nmielnik avatar Aug 20 '16 15:08 nmielnik

Hey there,

Remove disableSelection and use cancel option

$( "#sortable" ).sortable({cancel: '.ui-state-default .editable'});
var editor = new MediumEditor('.editable');

https://jsfiddle.net/e78ydow6/5/

ghost avatar Jun 13 '17 13:06 ghost

@j0k3r @webbieram , I think that the issue was in using JQuery Sortable and we can close this ticket.

What do you think?

ghost avatar Jun 15 '17 11:06 ghost

@webbieram you can call editor by function after sortable. I am working on same module and here everything fine.See in video If you are looking for same thing i will guide you further.

arifhussain353 avatar Jul 06 '17 04:07 arifhussain353

Not solving the problem itself, but a work around could be using portlets demo https://jsfiddle.net/4vam7mLm/

etoundi1er avatar May 14 '18 08:05 etoundi1er

This works perfect $("#sortable_list").sortable({ cancel: 'input,textarea,button,select,option,[contenteditable]' });

dhavalwebtual avatar Dec 31 '20 12:12 dhavalwebtual