Implementing auto-saving Web Content as draft in Liferay 7.2

Question

Since Liferay's Web Content can't be automatically saved as draft by default, I need to implement such a functionality.

I've found out that Web Content form contains hidden input field with id " _com_liferay_journal_web_portlet_JournalPortlet_workflowAction " and value=2 for Web Content with 'draft' status. Additionally, in Liferay's DB in journalarticle table there's status column with value=2 too.

I guess I should find my way to inject some JS code checking if such a form exists and its field has value=2, if so, serializing and sending form asynchronously. I wonder if there's the second way where I could check if there's any Web Content edited and what's its status by Java side. Then I would inject JS code that serializes and submits form without checking any source code.

I was thinking about creating DynamicInclude instance class. However, I was told that solution shouldn't be associated with editor, but directly with Web Content, because editors won't be used only during creating Web Content, probably they will be used in other places too. I got a hint, that ResourceFilter might help, but in my view it's not described in documentation enough so I could understand it.

I've got little experience with modifying Liferay components, so I have no idea, how to use all this knowledge in practice. I'd be glad for any tips.

EDIT :

At this moment I have successfully added JS code which asynchronously serializes and submits Web Content form. The problem is that it does it only first time (sends 302 POST request and receives 200 GET response ). Without refreshing page after next submit attempts there's only 200 POST request sent without any response. What's interesting, preview of this request contains error " Another user has made changes since you started editing. Please copy your changes and try again. ". I've got no idea how to solve this problem. I've searched Liferay 7.2 repository and found out, that exception with this error message is thrown when new version differs from the old one. That makes no sense, since Web Content version doesn't change after saving it as draft, I've even printed out response content in my Java code and it looks like these versions are equal. I'd be glad for any help, because I have no idea how to move on. Below I put my JavaScript code.

window.saveDraft = function() {

    var form = $('form#_com_liferay_journal_web_portlet_JournalPortlet_fm1');
    var url = form.attr('action');
    var p_auth = new URLSearchParams(url).get('p_auth');
    var language = form.find('#_com_liferay_journal_web_portlet_JournalPortlet_languageId').attr('value');

    var contentInput = form.find( "input[id^='_com_liferay_journal_web_portlet_JournalPortlet_content_INSTANCE_']" );
    var shortContentInputId = contentInput.attr('id');
    var contentInputIdRandomPart = shortContentInputId.substr(shortContentInputId.length - 4, shortContentInputId.length);

    var content = contentInput.attr('value');
    var fixedContent = content.replace(/\r?\n|\r/g, '');    //removing unnecessary line breaks

    var data = new FormData(form[0]);
    data.append('p_auth', p_auth);
    data.set('_com_liferay_journal_web_portlet_JournalPortlet_javax.portlet.action', 'updateArticle');
    data.set('_com_liferay_journal_web_portlet_JournalPortlet_ddmFormValues', '{"availableLanguageIds":["' + language +'"],"defaultLanguageId":"' + language +'","fieldValues":[{"instanceId":"' + contentInputIdRandomPart + '","name":"content","value":{"' + language +'":"' + fixedContent + '"}}]}');
    url = url.replace('&p_auth='  + p_auth, '');
    $.ajax({
        url: url,
        data: data,
        cache: false,
        processData: false,
        contentType: false,
        method: 'POST',
    })
};

Answer 1

I have successfully created module which saves Web Content as draft asynchronously. While searching for places where ArticleVersionException was being thrown, I forgot to check if my IDE marks all occurencies in code. It turned out that exception was being thrown in fragment of code checking if submit date is correct. That's why I needed to set timestamp value on actual one at the end of code after the form was submitted. In my case it's reached by this line of code:

form.find('#_com_liferay_journal_web_portlet_JournalPortlet_formDate').val(new Date().valueOf());