When using API events sometimes Content Tools helper elements is not removed while saving.

[mstojanovv]

Hi.

I'm using the API for saving the Content Tools data into the database. Sometimes happens when send the data to the server the helper elements from the Content Tools is not removed.

Ex. I add some the save it and its good. After that playing around removing paragraphs add new paragraphs,tables etc.. save it and not good :dancer:

I'm not sure what cause this problem. Any suggestions? Here is what i'm talking about. http://postimg.org/image/4b4a7sfx9/

Here is the code for saving:

    editor.bind('save', function(regions, calledBy) {
        var name, onStateChange, payload, xhr;
        // Set the editor as busy while we save our changes
        if (calledBy !== 'autoSave') {
            this.busy(true);
        }
        // Collect the contents of each region into a FormData instance
        payload = new FormData();
        payload.append('proposal_id', proposal_id);

        for (name in regions) {
            payload.append(name, regions[name]);
        }
        // Send the update content to the server to be saved
        onStateChange = function(ev) {
            // Check if the request is finished
            if (ev.target.readyState == 4) {
                editor.busy(false);
                if (ev.target.status == '200') {
                    // Save was successful, notify the user with a flash
                    if (calledBy !== 'autoSave') {
                        new ContentTools.FlashUI('ok');
                    }
                } else {
                    // Save failed, notify the user with a flash
                    new ContentTools.FlashUI('no');
                }
            }
        };
        xhr = new XMLHttpRequest();
        xhr.addEventListener('readystatechange', onStateChange);
        xhr.open('POST', admin_url + 'proposals/save_proposal_data');
        xhr.send(payload);
    });

Thanks

[anthonyjb]

Hi @mstojanovv can you please post any console information output when you see this issue as it sounds like an issue is occurring sometimes when saving. Also could you format the code above a little (just get the indentations correct) so I can better read it and see if I can spot the problem.

[mstojanovv]

http://s8.postimg.org/52wkrn2sl/image.png

Here is the console and also the $_POST data. No errors outputed and cant get it why sometimes the helper elements from the Content Tools is not removed.

This happens now ex. I added 2 table rows in the first table rows the elemnts were filled with text and in the seconds tr the elements were blank so in this case when i saved it the Content Tools elements were not removed.

[anthonyjb]

OK something really odd here is that the elements all seem to have the ce- prefixed helper classes attached to them and that shouldn't be the case. CT/CE should output HTML without the classes used by the library directly. This indicates that the HTML has at some been saved with those classes applied, which is commonly due to an error saving.

If you start with a clean set of content (e.g one that hasn't been corrupted with the CT/CE CSS classes) and remove auto-save does the error still occur? I'm wondering if the auto-save which is something I don't actually use anywhere other than in the tutorial is breaking something.

[mstojanovv]

I dont really use the autosave feature. This is copied from the tutorial.

I save the data by clicking on the button (the green button) from the editor.

Now i found when the error occurs but no idea why.

I start with a clean content. http://s21.postimg.org/4bsrvcr5z/image.png I add 1 paragraph with content TEST and save it - WORKS GOOD. After that i add table - http://postimg.org/image/s0u3axkwf/ And click the save button this error occurs - http://postimg.org/image/735dt6ynl/

Really strange.

[anthonyjb]

Is there any chance I can get access to try this myself - I can't understand why no errors are being reported to the console if the toolbox isn't disappearing - can you replicate this problem in the sandbox or demo site?

[mstojanovv]

Yes you can try it on the beta site. I sent you an email to your work mail. getme.co.uk

[anthonyjb]

Thanks for this (beta looks very smart :+1:)

As you say I only seem to be able to reproduce the error by inserting an item (either creating a table or inserting a new row).

In your code you have this line (may well be my example had this bad scoping in I'm too used to CoffeeScript).

region = ContentTools.EditorApp.get().orderedRegions()[0];

Can you replace it with

var region = ContentTools.EditorApp.get().orderedRegions()[0];

I'm wondering if the scope being set here to global is having side effects.

[mstojanovv]

I changed this. But seems the problem still exists.

Now only the paragraph get affected by the helper classes ce-element ce-element--type-text ce-element--focused.

Thanks.

[anthonyjb]

OK I could only produce the error if I used Add item can you confirm this is the case for you and if we take out the Add item code so that the issue not reproducible. I want to identify if the issue is strictly related to this code, if so then we can focus our attention there.

[mstojanovv]

Yes i'm quite a sure that the issue produces from the Add item code but only when the cursor is focused to some Content Tools element.

1. Try this with clean content and click directly add item - In this case you were not previously focused in some Content Tools element and the data send to server is good.
2. While you are focused on some element (like in the screenshot i sent to you) click Add Items - Data send to server is not good.

Thanks.

[anthonyjb]

OK this is now fixed I believe (I've uploaded a fixed version to your site). The issue was that you were starting the editor multiple times (e.g every time the add item button was clicked). So if the editor wasn't started already there was no problem, if it was then an issue was caused because the editor parsed the current content (which had all the special classes against it).

[mstojanovv]

Hi, This fixed the issue. I didnt thought that this can cause this kind of problem. Glad is fixed. Thanks for your help. Great job.