Preserve Line Breaks

Preserve line breaks in multiline text

NOT RELEASED Webflow's form notifications do not respond to any form of textarea line break modification, including \r\n, \n, <br>, \n\n, etc. This makes this feature somewhat useless with Webflow's form notifications.

If you need line breaks in your rich text areas, we recommend Basin instead.

Required Attributes

Add wfu-form

Add wfu-form to the form or form block element directly.

Add wfu-form-textarea

Designate the checkboxes you want removed-if-unchecked with the following attribute and value-

wfu-form-textarea = preserve-linebreaks

• Apply this to the element with wfu-form on it, if you want all checkboxes to be affected

• Apply this to an individual checkbox element if you want only specific checkboxes to be affected

<script>
document.addEventListener("DOMContentLoaded", function() {
    var form = document.getElementById('id-of-form');
    form.addEventListener('submit', function(event) {
        event.preventDefault(); // Prevent the form from submitting immediately

        // Get the textarea value
        var textarea = document.getElementById('id-of-textarea');
        var modifiedText = textarea.value.replace(/(\r\n|\r|\n)/g, '\\n');

        // Set the modified text back to the textarea or prepare it for sending
        textarea.value = modifiedText;

        // Now submit the form programmatically
        form.submit();
    });
});
</script>