Détecter le coller à la souris

Version imprimable

2 pièce(s) jointe(s)

Bonjour,

Vu mon incompétence en js, je fais encore appel à vous.
J'ai récupéré du code qui permet de contrôler le nombre maxi de caractères saisis dans un input ou un textarea.
Au fur et à mesure de la saisie, le texte "n caractères sur n maximum" s'affiche (ça ne fonctionne pas dans l'exemple ci-dessous, mais dans mon appli, c'est OK).
Voilà mon code (résumé) :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 <html> <head> <title> </title> </head> <body> <form name="FichePoste"> <script type="text/javascript" src="jquery.min.js"></script> <script type="text/javascript" src="maxlength.js"></script> Service : <div id="MaxService" style="font-size:11px;font-style:italic;text-align:right"> </div><br> <input type="text" name="Service" data-maxsize="10" data-output="MaxService" value="" size="50"> </form> </body> </html>
Si je tape au clavier, la saisie est bien limitée à 10 caractères.
Si je fais un Ctrl+V d'une chaine de plus de 10 caractères, celle-ci est bien tronquée à 10.
Par contre, si je fais un clic droit => coller, il me colle le texte sans tenir compte du maximum des 10 caractères.

Quelqu'un pourrait m'aider à intégrer ce contrôle svp ?

Merci.

Je joins également les fichiers js.

06/06/2013, 16h11
Bovino

onpaste, oninput.
06/06/2013, 16h13
pc75

Citation:

Envoyé par Bovino

onpaste

Merci,

Mais comme je l'ai écris, je suis incapable de m'en sortir tout seul. Je suppose qu'il faut que j'intègre du code dans le fichier maxlength.js, mais où et surtout comment ?
06/06/2013, 22h06
NoSmoking

Bonsoir,
et un maxlength="10" n'est pas suffisant sur l'INPUT.

L'équivalent sans plug-in:

Code:

1
2
3
4
5
6
7
8
<input type="text" name="Service" maxlength="10" onchange="updateCounter(this)" onkeyup="updateCounter(this)">
  <p><span id="counter">10</span> lettres restantes</p>
  <script>
    function updateCounter(input){
  var restant = parseInt(input.getAttribute("maxlength")) - input.value.length;
  document.getElementById("counter").innerText = restant; 
}
  </script>

http://codepen.io/seraphzz/pen/lGvLm

07/06/2013, 08h44
pc75

Merci pour ces réponses, mais quid des textarea ?

C'est vraiment compliqué (impossible) de contrôler le coller avec la souris dans le fichier js ?

Bon, à force de chercher, je pense avoir résolu mon problème.
J'ai ajouté ces deux lignes de code et le coller avec la souris est bien détecté.

Quelqu'un pour me confirmer que cette méthode est OK ?

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
function setformfieldsize($fields, optsize, optoutputdiv){
	var $=jQuery
	$fields.each(function(i){
		var $field=$(this)
		$field.data('maxsize', optsize || parseInt($field.attr('data-maxsize'))) //max character limit
		var statusdivid=optoutputdiv || $field.attr('data-output') //id of DIV to output status
		$field.data('$statusdiv', $('#'+statusdivid).length==1? $('#'+statusdivid) : null)

		$field.unbind('keypress.restrict').bind('keypress.restrict', function(e){
			setformfieldsize.restrict($field, e)
		})

		$field.unbind('keyup.show').bind('keyup.show', function(e){
			setformfieldsize.showlimit($field)
		})

		$field.bind('input propertychange', function(e){
			setformfieldsize.showlimit($field)
		})

		setformfieldsize.showlimit($field) //show status to start
	})
}