Diviser le textarea en deux!

**mawkli** · 24/05/2012, 10h35

Bonjour,
J'ai un textarea où s'écrit automatiquement des lignes lorsque je change les valeurs des champs dans le formulaire( des zones de texte et des listes déroulantes) et j'ai un bouton "vider" qui permet d'initialiser ces champs et de vider le textarea.
Le problème est que le textarea permet à l'utilisateur d'écrire aussi des commentaires,et une fois il clique sur "vider" je veux qu'il efface seulement ce qui a été entré via les champs et garder les commentaire,c'est à dire,en grosso modo,diviser le textarea en deux parties.mais je ne sais pas si c'est possible .Merci

**SpaceFrog** · 24/05/2012, 10h39

il y a un "sépareteur" entre les deux zones ?

ou un truc qui permet de distinguer les commentaires du reste ?

**mawkli** · 24/05/2012, 10h44

Oui j'aimerai par exemple mettre un séparateur tel que:

-------------------------------------------------------- par exemple

**mawkli** · 24/05/2012, 11h12

Y a-t-il une possibilité pour contrôler ça ligne par ligne dans le textarea? parceque je sais que le nombre de lignes que je veux effacer est 5 par exemple.

**SpaceFrog** · 24/05/2012, 11h29

peux tu nous montrer un exemple du contenu d'un textarea ?

a mon avis un simple replace avec une regExp permettrait de faire le ménage

**mawkli** · 24/05/2012, 11h40

Voilà une capture exemple de ce que je veux faire,la partie en bas est celle que je veux qu"elle soit effacée en cliquant sur "vider"
je n'ai pas réussi à joindre la photo

le text area doit être comme ça:
--------------------------------------------------------------------------
ça c'est le commentaire utilisateur à ne pas effacer !!

------------------------------------------------------
type de diffuseur

VB-T2
Emprunt pour une durÃ©e de:15jours
sa position dans les bÃ¢timents est:B3
le projet concernÃ© est:alen
sa prise utilisateur :max

**mawkli** · 24/05/2012, 11h48

Actuellement ma fonction qui vide les champs est la suivante

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
<script type='text/javascript'>
	function resetFields(){
	document.getElementById('element_3').selectedIndex=-1;
	document.getElementById('element_1').value="";
	document.getElementById('element_4').selectedIndex=-1;
	document.getElementById('element_2').value="";
	document.getElementById('element_5').value="";
	document.forms['form1'].elements['txtarea01'].value="";
 
}
</script>

je veux modifier la dernière ligne pour qu'elle n'efface que les lignes écrites via les champs ci-dessus

**SpaceFrog** · 24/05/2012, 12h42

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

document.forms['form1'].elements['txtarea01'].value=document.forms['form1'].elements['txtarea01'].value.match(/-{2,}(\D*)-{2,}/)[0];

**mawkli** · 24/05/2012, 14h13

Je n'ai pas compris ton code,je l'ai essayé tel qu'il est mais il ne fait rien!il n'efface pas du tout le textarea, est ce que tu peux m'expliquer l'idée?

**SpaceFrog** · 24/05/2012, 14h37

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
 
<script type="text/javascript">
function clean(){
obj=document.forms[0].elements['textarea01']
propre=obj.value.match(/-{2,}(\D*)-{2,}/m)[0];
obj.value=propre
}
</script>
</head>
 
<body>
<form name="form1" />
<textarea name="textarea01" rows="20" cols="80"> </textarea>
<input type ="button" id="foo" onclick="clean()" value="clean"/>
</form>
 
<script type="text/javascript">
var texte="--------------------------------------------------------------------------\nça c'est le commentaire utilisateur à ne pas effacer !!\n\n\n\n------------------------------------------------------\ntype de diffuseur VB-T2\nEmprunt pour une durÃ©e de:15jours\nsa position dans les bÃ¢timents est:B3\nle projet concernÃ© est:alen\nsa prise utilisateur :max";
document.forms[0].elements['textarea01'].value=texte;		
</script>
</body>
 
</html>

**mawkli** · 24/05/2012, 14h38

En fait,quand j'écrit une ligne avec des ---------------- il efface tout ce qui est dans textarea sauf la ligne!! mais déjà je ne sais pas comment mettre cette ligne par défaut au milieu de texarea?et comment dire dans 'onchange' des champs que l'écriture dans textarea sera après les -----?

**SpaceFrog** · 24/05/2012, 14h50

Heu quand ce sera clair dans ta tête, revient nous exposer clairement ta demande.
Là on ne sais pas ce que tu cherches à faire précisément
Décris nous clairement et précisément l'ergonomie recherchée ...

**mawkli** · 24/05/2012, 15h01

D'accord je m'explique,en fait je veux au chargement de la page mon textarea s'affiche avec la ligne (-----------------------)au milieu pour séparer la partie haute de commentaires de la partie basse où je dois dire à mes évenements 'onchange' des cinq champs d'écrire (après les -------),comme ça quand je clique sur le bouton 'vider' il efface la partie en bas et laisse la partie en haut des -----,voilà j'espère que l'idée est claire.merci

**mawkli** · 24/05/2012, 15h11

voilà une capture de ce que je veux faire

**SpaceFrog** · 24/05/2012, 15h25

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
<script type="text/javascript">
function clean(){
obj=document.forms[0].elements['textarea01']
propre=obj.value.match(/^\D+-{2,}/m)[0];
obj.value=propre
}
 
function addtoTA(iid,txt){
document.forms[0].elements['textarea01'].value+="\n"+iid+" :\t"+txt;
}
</script>
</head>
 
<body>
<form name="form1" />
<textarea name="textarea01" rows="20" cols="80"> </textarea>
<input type ="button" id="foo" onclick="clean()" value="clean"/>
</form>
<input type="text" value="" id="id_1" onchange="addtoTA(this.value, this.id)" />
<input type="text" value="" id="id_2" onchange="addtoTA(this.value, this.id)" />
<input type="text" value="" id="id_3" onchange="addtoTA(this.value, this.id)" />
<input type="text" value="" id="id_4" onchange="addtoTA(this.value, this.id)" />
<input type="text" value="" id="id_5" onchange="addtoTA(this.value, this.id)" />
<input type="text" value="" id="id_6" onchange="addtoTA(this.value, this.id)" />
 
<script type="text/javascript">
var texte="\nCommentaire à conserver \n\n\n\n--------------------------------------------------------------------------\n";
document.forms[0].elements['textarea01'].value=texte;		
</script>
</body>
 
</html>

**mawkli** · 24/05/2012, 16h23

merci spaceFrog pour le code,la fonction clean() marche bien,la fonction addtoTA(iid,txt) ne fait pas exactement ce que je veux donc je la retiré,mais le code

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
<script type="text/javascript">
var texte="\nCommentaire à conserver \n\n\n\n--------------------------------------------------------------------------\n";
document.forms[0].elements['content'].value=texte;		
</script>

il "s'exécute" pas ,je veux dire au chargement de la page il ne s'affiche pas dans textarea.
aussi,pour dire au premier champ dans onchange d'écrire après les --------?

**SpaceFrog** · 24/05/2012, 16h28

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
<script type="text/javascript">
var texte="\n\n\n\n\n--------------------------------------------------------------------------\n";
document.forms[0].elements['content'].value=texte;		
</script>

et tu fais un += dans le value du textarea

**Auteur** · 24/05/2012, 18h45

Sans doute une question stupide, mais pourquoi ne pas utiliser deux textarea dont un en lecture seule ?

**mawkli** · 25/05/2012, 09h47

Exuse moi spaceFrog mais je n'ai pas compris le += dans value sera suivi par quoi? genre est ce que sera comme ça <textarea value+= texte> ?

**SpaceFrog** · 25/05/2012, 09h50

Je pense que tu devrais d'abord apprendre la javascript avant de vouloir te lancer dans des developpements comme ça ...

un exemple de +=

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<input type="texte" onclick="this.value+='_ajout_'" />

Diviser le textarea en deux!

JavaScript

Discussions similaires

Partager

Partager