MDB wysiwyg last character is lost

Maybe this bug happen when we get contents from textarea which WYSIWYG is bound to, because if I get value of standart textarea - I get everything I've typed, and after I bind WYSIWYG plugin to it - there is a result without last character.

If I type "TEST" - the result is "TES".

Examples:

https://photos.app.goo.gl/feGPah3JkX4iYS318 https://photos.app.goo.gl/uYNMGUT5P8Nmocta7

So, what I've done by steps:

1. I included CSS and JS files for WYSIWYG plugin, second goes at the end of page:<link rel="stylesheet" href="../assets/css/wysiwyg.css">``<script type="text/javascript" src="../assets/js/wysiwyg.min.js"></script>

2. I created textarea <textarea id="personalNotes" name="personal-notes"></textarea>

3. Then I've bound this plugin to textarea as described in it's tutorial $("#personalNotes").mdbWYSIWYG();

So now, when I want to get it's content, for example I put a button with jQuery method and trying to get text I've typed:

<button type="button" id="btn-save-notes" class="btn btn-primary btn-sm">Save</button>

$('#btn-save-notes').on('click', function(e) {<br> alert($('#personalNotes').val());<br> });

If i type "My text is here", I get <p>My text her</p> in alert box, part of text is missed

Thank you for providing the details. I spent some time to recreate your issue and debug the problem, but it was worth it! It's a bug that will be fixed in the nearest release (next release will be shipped on 4th March. If you don't want to wait I can tell you how to fix it ;)

This makes me kinda ashamed, but when I was creating the WYSIWYG editor, I used a wrong event to update the value of the native textarea. I used the "keypress" so the value is being updated just before you type the next letter so to fix it up, we need to "wait" for the letter to be "printed". To fix it, open the wysiwyg.js file and locate the following line:

$("#wysiwyg-".concat(this.uuid)).on('keypress', this.updateNativeTextarea.bind(this));

Then, replace the "keypress" with "keydown":

$("#wysiwyg-".concat(this.uuid)).on('keydown', this.updateNativeTextarea.bind(this));

Thanks for your answer! But it still doesn't work properly.

So what I've done to test after I replaced keypress with keydown in JS file:

Get data via POST and save it directly to database (without any changes for test steps) - the same with alerts or console.log() for viewing the result

1) Type: "Testing WYSIWYG editor"

Result: "Testing WYSIWYG edito" - just text without last character

2) Change to: "Testing WYSIWYG editor to use it in my project" and make it Bold

Result: "Testing WYSIWYG editor to use it in my project" - last character is now here, but no BOLD tags and paragraph tags at all

3) Breakline and type: "Testing WYSIWYG editor to use it in my projectTest center line", put "Test center line" at the center of the screen

Result: "<b>Testing WYSIWYG editor to use it in my project</b><div><b>Test center line</b></div>" - some "divs" came and no central position (after update from DB). Still not bold

4) Then I removed all text and typed: "Why my text is not shown as I type it?" - I've made it BOLD and ITALIC

Result: "Why my text is not shown as I type it" - last char is on it's place, but no tags, text only...

Please help me to fix these bugs, I need text editor in my project =)

Thanks;)

Hello! Any update? I still have issues listed in the last response in this topic, even I just upgraded to the lastest version 4.8.7

Please help me

Hello, have this issue been fixed?