Search code examples
ckeditor

CK Editor - copy and paste

I am trying to copy and paste a custom drop down. The custom drop down html looks like this -

<span class="fp-dropdown-popup elastic-input error" contenteditable="false">
    <button class="fp-dropdown-button" tabindex="0">
        <span class="fp-placeholder">Select One</span>
    </button>
    <span class="fp-menu" data-fp-items="[goods]">
    </span>
</span>

within the CK Editor afterPaste event I inspect my html and it looks like this -

<span contenteditable="false">
    <button tabindex="0">
        <span>Select One</span>
    </button>
    <span data-fp-items="[goods]">
    </span>
</span>

all of the classes have been removed from all of the elements.

I've looked through several posts that say to make sure allowed content is true and it is. config.allowedContent = true;

What else should I be looking for to figure out where those attributes are being removed?

Solution

  • Looks like your rule wasn't applied (or it was overwritten)

    If you run in browser console

    CKEDITOR.instances[YOUR_INSTANCE_NAME].filter.allowedContent

    it should output array with zero length, meaning everything is allowed.

    You can try to paste custom dropdown here - https://sdk.ckeditor.com/samples/acf.html on bottom editor, as for me everything is preserved.