convertire retour auto en \n dans textarea

**gforce** · 08/09/2006, 15h29

Bonjour,

Si un mot atteint l'extrémité droite du textarea celui-ci passe directement à la ligne. Cela marche sans problème mais là ou sa bloque c'est qu'il ne me fait pas un \n, donc si je fais un rendu du textarea il n'y a aucun retour ligne. Je suis obligé de faire enter pour qu'il m'affiche bien un br apres traitement

Voilà j'espère avoir été clair .

Et merci pour votre aide !

**Hug0_76** · 08/09/2006, 16h49

Salut, gforce!

Excuse de mon retard et de ne pas avoir répondu à ton email, mais je ne suis revenu sur le forum que depuis 16h!

Ce que tu demandes est faisable mais compliqué à réaliser!
En effet un textarea a pour principe de posséder une taille en colonne ce qui empêche d'écrire plus loin que ca taille cols="n".

Par contre, avec un peu de JS je pense que tu peux insérer un '\n' à chaque fois qu'une ligne est rajoutée!

Enfin c'est à toi de voir! Si c'est vraiment important d'afficher une copie EXACT de ton textarea, ou si tu peux tout simplement afficher son texte!

Une autre solution possible est d'insérer dans une boite ton texte!
Genre tu mets ton texte dans un div (ou span => peut etre mieux) de 200px comme ca tu auras le même appercu de ton texte que dans ton textarea!
200px ici est un exemple!
A toi de trouver la correspondance entre la taille en colonnes de ton textarea et les pixels

!

Autre remarque : Lorsque dans ton textarea il y a un retour à la ligne, cela ne correspond pas du tout à un saut de ligne autrement dit un '\n'.

Sinon je suis bete mais pourquoi est ce que tu ne remettrai pas ton texte dans le meme textarea que celui où tu as écris??? C-a-d avec le même nombre de colonnes et de lignes??

**gforce** · 11/09/2006, 08h58

voici le code final qui fonctionne mais bon le compteur de ligne ne fonctione plus :-(

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
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
 
<html>
	<head>
		<title>Textarea</title>
		<script language="JavaScript" type="text/javascript">
 
			var MAX_CARAC = 400;
			var MAX_LINE = 10;
 
			/** Fonction qui va mettre à jour les champs en fonction du nombre de caractères entré ainsi que 
			*	du nombre de lignes.
			*/
			function countRow() {
				textarea = document.getElementById("pagetext");
				b = document.getElementById("modif");
				d1 = document.getElementById("nb_carac");
				d2 = document.getElementById("nb_carac_restant");
				d3 = document.getElementById("nb_lignes_restantes");
 
				text = textarea.value;
				tab = text.split("\n","<br />");
 
				d1.innerHTML = "Nb caractères : "+text.length;
				d2.innerHTML = "Caractères restant : "+(MAX_CARAC - text.length);
				d3.innerHTML = "Lignes restantes : "+(MAX_LINE - tab.length);
 
				if(tab.length >= MAX_LINE || text.length >= MAX_CARAC) {
					textarea.disabled = true;
					b.disabled = false;
				}
			}
 
			/** Fonction permet le comptage des caractères ainsi que des lignes, grâce à l'appel de la fonction countRow() 
			*	On appel la fonction action() tous les 100e de seconde pour simuler le compage en temps réel.
			*/
			function action() {
				countRow();
				t =	setTimeout("action()",100);
			}
 
			/** Cette fonction permet tout simplement de rendre la main, lorsque l'on click sur le bouton : Modifier Text.
			*	Lorsqu'il y a 360 caractères, la fonction va supprimé le dernier caractère puis rendre la main au textarea.
			*	Lorsqu'il y a 10 lignes, la dernière sera supprimée, puis la main sera rendu au textarea.
			*/
			function main() {
				window.clearTimeout(t);
				var temp="";
				textarea = document.getElementById("pagetext");
				b = document.getElementById("modif");
				carac_restant = MAX_CARAC-textarea.value.length;
				ligne_restante = MAX_LINE-(textarea.value.split("\n")).length;
			 	tab = (textarea.value).split("\n");
				if(ligne_restante == 0) {
					for(i=0; i<(MAX_LINE-2); i++) {
						temp += tab[i]+"\n";
					}
					textarea.value = temp;
				} else {
					if(carac_restant == 0) {
						textarea.value = (textarea.value).substring(0,(textarea.value).length-1);
					}
				}
				textarea.disabled = false;
				b.disabled = true;
 
				// On réappel la fonction pour continuer le traitement
				action();			
			}
 
 
			/** Fonction qui réinitialise tous les champs.*/
			function raz() {
				if(confirm("Souhaitez vous tout effacer ?")) {
					textarea = document.getElementById("pagetext");
					b = document.getElementById("modif");
					d1 = document.getElementById("nb_carac");
					d2 = document.getElementById("nb_carac_restant");
					d3 = document.getElementById("nb_lignes_restantes");
 
					/** On réinitialise tous les champs 
					*    - le textarea
					*	 - les champs comptant les caractères ainsi que les lignes
					*	 - pour le cas où le textarea est inutilisable, on lui rend la main
					*/
					textarea.value = "";
					d1.innerHTML = "Nb caractères : "+text.length;
					d2.innerHTML = "Caractères restant : "+(MAX_CARAC - text.length);
					d3.innerHTML = "Lignes restantes : "+(MAX_LINE - tab.length);
					if((textarea.disabled)) {
						textarea.disabled = false;
					}
					b.disabled = true;
				}
 
				// On réappel la fonction pour continuer le traitement
				action();
			}
		</script>
 
	</head>
 
 
	<body onLoad="action();">
	<form  method="post" name="formlaire"  action="<?php echo $_SERVER['PHP_SELF']; ?>" rows="10" cols="50">
		<textarea name="pagetexte" id="pagetext" rows="10" cols="50" wrap="hard"></textarea><br>
 
		<div id="nb_carac">Nb caractères :</div><br>
		<div id="nb_carac_restant">Caractères restant :</div><br>
		<div id="nb_lignes_restantes">Lignes restantes :</div>  <br>
 
		<input type="button" value="Modifier le texte" onClick="main()" disabled id="modif">
		<input type="button" value="Tout effacer" onClick="raz()"><br />
		<input type="submit" value="Submit">
	</form>
	<?php str_replace("#", "\n", $_POST['pagetexte']) ?>
	<?php $_POST['pagetexte'] = nl2br($_POST['pagetexte']); ?>
	<div style="width:100%;height:280px;background:#EBEBEB"><?php echo $_POST['pagetexte']; ?></div>
 
	</body>
 
</html>

A mettre dans un fichier .php pour tester
Et un grand merci a Hug0_76

convertire retour auto en \n dans textarea

JavaScript

Discussions similaires

Partager

Partager