Contenteditable - Saut de ligne et espace

Nikola
Javascript

Bonjour,

J'ai un problème avec une div éditable, précisément à l'affichage de mes données envoyés par un formulaire ajax.
Si des données sont présentes alors l'envois se fait.
Cela est aussi valable quand l'utilisateur post uniquement des sauts de ligne et des espaces, c'est ça que je n'arrive pas a échapper.

Voici mon code

### Voici ma div editable :
<div class="card-composer-value" id="composer-value" name="post_text" data-placeholder="Exprimez-vous" contenteditable="true"></div>

### Voici ma condition
if(datas){ // Si données == true
    let data = {
        content: post_text
        // autres données
    }
    new Post().Upload(data)
} else {
    return false;
}

### Voici l'affichage de la donnée qui pose problème présente dans la classe Post() : 
container.innerHTML += data.content

Ce que je veux

J'aimerai que les sauts de ligne et les espaces présents uniquement lors de l'envois du formulaire, soit échappés.

Ce que j'obtiens

J'ai essayé pas mal de choses pour tenter d'échapper les sauts de lignes, et les espaces avec :

value = value.replace(/&nbsp;/g, '')
value = value.replace(/</br>/g, '')

Cela ne fonctionne pas, le caractère html espace et saut de ligne s'envois comme une chaine de caractère.
Avec un console.log(type of data) j'ai pu voir que ces caractères renvoyais "string"

J'ai aussi essayé avec une conditon avant l'envoi des données, mais sans succès...

Si jamais vous pouvez m'aider
Merci beaucoup ;)

2 réponses

Pierrot01

salut

data n'est pas reconnu en dehors de la structure if ;)

Pour rappel de l'instruction let : sa principale caractéristique est sa portée : elle est limité à celle du bloc courant. Pour rappel, un bloc en Javascript, c’est ce qu’on retrouve entre accolades : une comparaison en if, une boucle while etc…

voilà ce qui devrait t'arranger ;)

### Voici ma condition
if(datas){ // Si données == true
    var data = {
        content: post_text
        // autres données
    }
    new Post().Upload(data)
} else {
    return false;
}

### Voici l'affichage de la donnée qui pose problème présente dans la classe Post() : 
container.innerHTML += data.content

@pluche

Pierre

Nikola
Auteur

Merci pour l'info, ça ne résoud pas le problème des sauts de ligne et des espaces échappés, c'est post_text qui est concerné, et qui récupère la valeur du div éditable.
J'ai remodifié les valeurs pour mieux comprendre.
C'est la variable datastream qui récupère le texte dans le div éditable
J'aimerai que les sauts de ligne et les espaces envoyés sans autre caractères au serveur soit échappés


let datastream  = document.getElementById('composer-value').innerHTML;

        if(datastream){
            var datas = {
                content: datastream
            }
            new Post().Upload(datas)
        } else {
            return false;
        }