TINYMCE 6:
I'm using TinyMCE as a rich text editor inside a Django form, and I'm facing a strange issue: when I submit the form, any new lines in the text are being stripped, and the final content saved looks like this:
<p></p>
<p></p>
When I inspect the editor before submission, the content looks fine with proper paragraphs or
tags, but after submission it gets wiped out or turned into just empty paragraphs.
Here’s my TinyMCE setup:
tinymce.init({
selector: '#id_description',
content_style: `
.mce-content-body p {
margin-block-start: 0em;
margin-block-end: 0em;
}
`,
branding: false,
plugins: 'advlist lists autoresize',
toolbar: 'bold italic underline | bullist numlist',
promotion: false,
menubar: false,
resize: false,
min_height: 400,
statusbar: false,
formats: {
underline: { inline: 'u', exact: true }
},
invalid_elements: 'span,div,script,img,table,blockquote',
valid_elements: 'br,p,strong/b,em/i,u,ul,ol,li',
newlines_to_brs: true,
forced_root_block: false,
remove_trailing_brs: true
});
description = forms.CharField(
max_length=3000,
min_length=500,
widget=TinyMCE(attrs={
'class': 'w-full px-4 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition duration-200',
'placeholder': 'Describe the job responsibilities and requirements...',
'minLength':'500',
'maxlength': '3000',
'id': 'id_description',
'oninput': 'autoResize(this)',
'style': 'min-height: 8rem; overflow-y: hidden; resize: none;'
}, ),
validators=[
MinLengthValidator(500),
MaxLengthValidator(3000)
],
help_text="Please provide a detailed description (between 50 and 2000 characters).",
required=True
)
The param you're looking for is newline_behavior:
tinymce.init({
// ...
newline_behavior: 'linebreak', // Makes Enter insert a <br> instead of a new paragraph
});
Please note, that you'll need to have at least version 6.1