Restreinde le nombre de lignes dans textarea

Version imprimable

Voir 40 message(s) de cette discussion en une page

06/09/2006, 11h11
gforce

Restreinde le nombre de lignes dans textarea

bonjour,

connaissez vous un moyen de restreinde le nombre de lignes dans textarea ? Par ex après 10 lignes on ne peu plus rien insérer

Merci
06/09/2006, 11h25
Hug0_76

Salut,

Restreindre un nombre de ligne non je ne sais pas faire mais par contre restreindre le nombre de caractères c'est possible avec du javascript!

Google ne t'a rien donné sur les lignes et les textarea???
06/09/2006, 11h34
gforce

pour le nombre de caractères j'ai déjà une fonction qui marche du tonerre mais j'aimerais aussi controller le nombre de ligne
06/09/2006, 11h49
olk2r

cela devrait peut-être pourvoir t'aider !!!
http://javascript.internet.com/page-...and-lines.html

Olive
06/09/2006, 11h59
SpaceFrog

avec un split sur le caractère de retour ligne puis la longeuer du tableau retourné ...
06/09/2006, 12h02
Hug0_76

Exact,
tout simplement compter le nombre \n !:marteau:
06/09/2006, 12h04
gforce

Citation:

Envoyé par olk2r

cela devrait peut-être pourvoir t'aider !!!
http://javascript.internet.com/page-...and-lines.html

Olive

merci c'est génial je vais essayer ça

que pourrais je ajouter a cette fonction pour qu'elle compte le nombre de ligne?

Code:

1
2
3
4
5
6
7
8
 
function limitText(limitField, limitCount, limitNum) {
	if (limitField.value.length > limitNum) {
		limitField.value = limitField.value.substring(0, limitNum);
	} else {
		limitCount.value = limitNum - limitField.value.length;
	}
}

Comme l'a dit spacefrog tu peux compter le nombre de caractère \n de ta chaine de caractères!
Code:

1 2 3 4 5 6 7 textarea = document.getElementById('id_text_area'); text = textarea.value; tab = text.split("\n"); if(tab.length >= 10) { textarea.disabled; }

j'ai testé mais ca ne n'a pas l'air de fonctionner
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 function limitText(limitField, limitCount, limitNum) { if (limitField.value.length > limitNum) { limitField.value = limitField.value.substring(0, limitNum); } else { limitCount.value = limitNum - limitField.value.length; } textarea = limitField; text = textarea.value; tab = text.split("\n"); if(tab.length >= 10) { textarea.disabled; } }
Code:

1 2 3 4 5 6 <textarea name="pagetext" id="pagetext" onKeyDown="limitText(this.form.pagetext,this.form.countdown,360);" onKeyUp="limitText(this.form.pagetext,this.form.countdown,360);"> </textarea>
Il y a un autre problème c'est que lorsque je veux afficher le texte ecrit par la suite il ne me fait des retour à la ligne uniquement où j'ai tapé un retour chariot. Il faidrait que lorsque qu'il va a la ligne dans le texte area il m'imprime aussi un <\n>

Tiens voila un code, que l'on peut biensur améliorer mais en tout cas il fait l'action que tu cherches!
Autrement dit dès que les 10 lignes sont dépassés le textarea se désactive ;)!

Tu peux libérer le timeoutcreer, tu peux nommer différemment les fonctions, tu peux faire une fonction countRow beaucoup plus générique en lui passant en paramètre un id, tu peux changer de fonction si tu n'aimes pas getElementById....enfin bref tu fais ce que tu veux mais ca marche ;)!
Code:

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 <html> <head> <title>Textarea</title> <script language="JavaScript" type="text/javascript"> function countRow() { textarea = document.getElementById("text1"); text = textarea.value; tab = text.split("\n"); if(tab.length >= 10) { textarea.disabled = true; } } function action() { countRow(); setTimeout("action()",100); } </script> </head> <body> <textarea rows="10" cols="20" onFocus="action()" id="text1"> </textarea> </body> </html>
Testé uniquement sur IE!
Maintenant c'est testé sur FF ;)

bon je récapitule pcq ca ne va toujour pas et je n'arrive pas a trouver l'erreur.
Aussi serait il moyen de regrouper les 2 fonctions en une?

fichier js

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
 
function limitText(limitField, limitCount, limitNum) {
	if (limitField.value.length > limitNum) {
		limitField.value = limitField.value.substring(0, limitNum);
	} else {
		limitCount.value = limitNum - limitField.value.length;
	}
}
 
function countRow() {
	textarea = document.getElementById("pagetext");
	text = textarea.value;
	tab = text.split("\n");
	if(tab.length >= 10) {
		textarea.disabled = true;
	}
}
 
function action() {
	countRow();
	setTimeout("action()",100);
}

ficher html

Code:

1
2
3
4
 
<textarea name="pagetext"id="pagetext" onFocus="action()"
		onKeyDown="limitText(this.form.pagetext,this.form.countdown,360);" 
		onKeyUp="limitText(this.form.pagetext,this.form.countdown,360);"></textarea>

Citation:

<textarea name="pagetext"id="pagetext" onFocus="action()"
onKeyDown="limitText(this.form.pagetext,this.form.countdown,360);"
onKeyUp="limitText(this.form.pagetext,this.form.countdown,360);"></textarea>
Code:

1 2 3 <textarea name="pagetext" id="pagetext" onFocus="action()" onKeyDown="limitText(this.form.pagetext,this.form.countdown,360);" onKeyUp="limitText(this.form.pagetext,this.form.countdown,360);"></textarea>
Et si tu changes ca???

NON après vérification ce n'est pas ca qui bug mais ta fonction limitText....
ben il faut voir ta fonction!
je regarde d'un peu plus près ton code....

Ton textarea est bien dans un formulaire???

this.form.countdown <= c'est quoi ca?? Ca sort d'où?

06/09/2006, 16h06
gforce

oui pour le formulaire
le countdown c'est pour le petit textearea qui affiche le nombre de caractère

ok merci :P

l y a un dernier problème c'est que lorsque je veux afficher le texte ecrit par la suite il ne me fait des retour à la ligne uniquement où j'ai tapé un retour chariot. Il faudrait que lorsque qu'il va a la ligne dans le textarea il m'imprime aussi un <\n> lors de l'affichage. Est ce compréhensible?
06/09/2006, 16h26
Hug0_76

Tu cherches à faire un compteur de caractères dans ton deuxième textarea c'est ca???

En fait ta fonction pour compter le nombre de caractères n'est pas terrible (enfin c'est mon avis).
Je reviens avec qqc que je préfère!
Après tu en feras ce que tu veux ;)!
06/09/2006, 16h29
gforce

voila donc il faudrait:

1 textarea => contenu
1 input => compteur de caractères
1 input => compteur de lignes

voila :

Code:

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
 
<html>
	<head>
		<title>Textarea</title>
		<script language="JavaScript" type="text/javascript">
 
			function countRow() {
				textarea = document.getElementById("pagetext");
				i = document.getElementById("nb_carac");
				i_res = document.getElementById("nb_carac_restant");
				text = textarea.value;
				tab = text.split("\n");
				i.value = text.length;
				i_res.value = 360 - text.length;
				if(tab.length >= 10 || text.length >= 360) {
					textarea.disabled = true;
				}
 
			}
			function action() {
				countRow();
				setTimeout("action()",100);
			}
		</script>
 
	</head>
 
 
	<body>
 
 
		<textarea name="pagetexte" id="pagetext" onFocus="action()" rows="10" cols="50"></textarea><br>
		<label>Nb caractères :</label><input type="text" id="nb_carac" size="4"><br>
		<label>Caractères restant :</label><input type="text" id="nb_carac_restant" size="4"><br>
 
 
	</body>
 
</html>

Ca te désactive ton truc quand tu passes à plus de 360 caractères et quand tu dépasses 10 lignes!
L'utilisation du innerHTML est beaucoup plus jolie, mais c'est un truc vite fait!

06/09/2006, 16h44
gforce

:D wouaw . c'ets top .Merci

Il faudrait juste que ca affiche de nombre de ligne restante.
Et peut etre laisser accès quand le nombre de caractère et ligne est atteint, si non l'utilisateur ne sais plus effacer.

mais si non c'est ca !cool!
06/09/2006, 17h06
Hug0_76

hum, bon atten un peu parce que là il y a un peu de bidouillage!
Je vais essayer de faire ca propre!

Bon je vais te faire ca ce soir, parce que là je dois y aller!
Sinon il faut supprimer une ligne ou 1 caractères au moment de rendre la main!
Essayes de comprendre le code et de le modifier, sinon attend ce soir!
06/09/2006, 17h23
gforce

ok merci je vais attendre ce soir de toute façon moi aussi je part .

a+ thx

Voir 40 message(s) de cette discussion en une page