Discussion :

[plsavary]

Bonjour,

J'ai un formulaire. Et je veux faire un contrôle pour vérifier si l'utilisateur quitte le formulaire avec des modifications en cours non validées.

Code :

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

1
2
3
4
5
 
//Vérifie si le formulaire est modifié
$(':input',document.<%=request.getParameter("formName")%>).bind("change", function() { 
	dataChanged = true; 
});

Ce code fonctionne bien avec les champs texte.
Mais si je coche une checkbox (ou un radio button) et que je la décoche après, il déclenche l'évènement. Alors que rien n'est modifié.

Avez-vous une idée ?

[psychomatt]

Je déterre un peu ce sujet mais j'ai été confronté au cas hier... Je poste donc ma solution ici, ça peut toujours servir.

A l'initialisation:

Code :

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

1
2
3
4
5
6
var gFormSnapshot;
$(document).ready( function(){
...
 
gFormSnapshot = $('#form').serializeArray();
});

Fonction à utiliser pour savoir si le formulaire a été modifié:

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
 
function formHasChange(){
	var notChanged	= true;
	var currentForm		= $('#form').serializeArray();
	var snapshotLen		= gFormSnapshot.length;
 
	if( currentForm.length != snapshotLen ){
		return true;
	} else {
		var i=0, j=0;
		var find = false;
		while( i < snapshotLen && notChanged ){
			find = false;
			while( j < snapshotLen && !find){
				if( gFormSnapshot[i].name == currentForm[j].name ){
					notChanged = notChanged && gFormSnapshot[i].value == currentForm[j].value;
					find = true;
				}
				j++;
			}
			if( !find ){ return true;}
			i++;
		}
	}
	return !notChanged;
}