TypeError: $()dialog is not a function

**freestyler1982** · 22/02/2016, 17h43

Bonjour,

J'aimerais bien utiliser une confirm dialog de Jquery.

pour cela j'ai déclaré une div dans ma jsp :

Code :

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

1
2
 
<div id="dialog-confirm"></div>

j'ai récupéré la dernière version Jquery du site :

Code :

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

1
2
3
 <script src="${pageContext.request.contextPath}/slickgrid/lib/jquery.js"></script> 
 <script src="${pageContext.request.contextPath}/slickgrid/lib/jquery-ui.js"></script> 
 <script src="${pageContext.request.contextPath}/slickgrid/lib/jquery-ui.min.js"></script>

à l’exécution de mon écran j'ai ce message d'erreur :

TypeError: $(...).dialog is not a function

Pour quelle raison(s) à votre avis ?

**SpaceFrog** · 22/02/2016, 17h51

A quel endroit et sous quelle forme ton dialog est il appelé ?

**freestyler1982** · 22/02/2016, 18h00

c'est appelé dans une fonction JS

avec voici le code d'appel :

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
 
$("#dialog-confirm").dialog({
        resizable: false,
        modal: true,
        title: "Modal",
        height: 250,
        width: 400,
        buttons: {
            "Yes": function () {
               alert('ok');
            },
                "No": function () {
                $(this).dialog('close');
            }
        }
    });
}

**SpaceFrog** · 22/02/2016, 18h08

est elle dans un document.ready ?

**freestyler1982** · 22/02/2016, 18h13

Non dans une fonction javascript et il y a pas de document.ready dans ce fichier JS.

**SpaceFrog** · 22/02/2016, 18h16

colle le dans un document.ready tu verras que ça ira bien mieux
http://javascript.developpez.com/faq...oduction#Ready

**freestyler1982** · 22/02/2016, 18h19

Merci infiniment ^^
je testerai ça

**freestyler1982** · 22/02/2016, 18h32

ça ne marche toujours pas

voici le code intégral de la fonction

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
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
 
 
function ouvrirJustifDejustif(type,informationMessage) {
 
	$(document).ready(function() {	
 
		$("#dialog-confirm").dialog({
	        resizable: false,
	        modal: true,
	        title: "Modal",
	        height: 250,
	        width: 400,
	        buttons: {
	            "Yes": function () {
	            	var egal = 1;
	            	var libelleDuLot;
 
	            	if(grid.getSelectedRows().length > 0) {
	            	var firstItem = dataView.getItem(grid.getSelectedRows()[0]);
	            	var firstLib = firstItem['libJustif'];
 
	            	for (var i = 1; i < grid.getSelectedRows().length; i++) {
	            				var currentLib;
	            				var dataItem = [];
	            				dataItem = dataView.getItem(grid.getSelectedRows()[i]);
	            				currentLib = dataItem['libJustif'];
	            				if(firstLib != currentLib) {
	            					egal = 0;
	            				}	
	            	      }
	            	}
	            		document.getElementById("txtAreaPopinJustif").value = "";
	            		if (type == "justif") {
	            			//document.getElementById("infoMessage").innerHTML = informationMessage;
	            			document.getElementById("cptaOKKO").value = "NoValue";
	            			document.getElementById("titreJustif").innerHTML = libelles['justifTitre'];
	            			document.getElementById("mtJustifTotalContainer").className = "item-details-editor-container";
	            			document.getElementById("btnDejustifier").style.display = "none";
	            			document.getElementById("btnJustifier").style.display = "inline";
	            			document.getElementById("cpta").style.display = "block";
	            			document.getElementById("cptaOKKO").style.display = "block";
	            			document.getElementById("reconductible_Label").style.display = "block";
	            			document.getElementById("reconductible_checkbox").style.display = "block";
	            			document.getElementById("reconductible_checkbox").checked = false;
	            			document.getElementById("justifLib").style.display = "inline";
	            			document.getElementById("DejustifLib").style.display = "none";
	            			document.getElementById('mtJustifTotal').readOnly = false;
 
	            			if(egal == 1) {
	            				document.getElementById("txtAreaPopinJustif").value = firstLib;
	            			}
	            		} else {
	            			//document.getElementById("infoMessage").innerHTML = informationMessage;
	            			document.getElementById("mtJustifTotalContainer").className = "item-details-editor-container-readonly";
	            			document.getElementById("titreJustif").innerHTML = libelles['dejustifTitre'];
	            			document.getElementById("btnDejustifier").style.display = "inline";
	            			document.getElementById("btnJustifier").style.display = "none";
	            			document.getElementById("cpta").style.display = "none";
	            			document.getElementById("cptaOKKO").style.display = "none";
	            			document.getElementById("cptaOKKO").value = "OK";
	            			document.getElementById("reconductible_Label").style.display = "none";
	            			document.getElementById("reconductible_checkbox").style.display = "none";
 
	            			document.getElementById("justifLib").style.display = "none";
	            			document.getElementById("DejustifLib").style.display = "inline";
	            			document.getElementById("mtJustifTotal").readOnly = true;
	            			if(egal == 1) {
	            				document.getElementById("txtAreaPopinJustif").value = firstLib;
	            			}
	            		}
	            		document.getElementById("inputPopInJustif").value = "";
 
	            		param = "";
	            		var dataSelected = [];
	            		if (grid.getSelectedRows().length > 0) {
	            			document.getElementById('popInJustif').style.display = "block";
	            			document.getElementById('backJustif').style.display = "block";
	            			document.getElementById('inputPopInJustif').value = -1;
	            			document.getElementById('txtAreaPopinJustif').focus();
 
	            			$("#backJustif").fadeIn("slow");
	            			$("#popInJustif").fadeIn("slow");
	            			mtSoldeTotal = 0;
	            			var mtJustifTotal = 0;
	            			var sommeMontantJustif = 0;
 
	            			for (var p = 0; p < grid.getSelectedRows().length; p++) {
	            				var dataItem = [];
	            				dataItem = dataView.getItem(grid.getSelectedRows()[p]);
	            				checkedDataView.setItems(dataSelected);
	            				if (p > 0) {
	            					param += "&";
	            				}
	            				param += "idE" + p + "=" + dataItem['id'];
	            				mtSoldeTotal += dataItem['mtEcart'];
	            				dataSelected[p] = {
	            					id : dataItem['id'],
	            					cdSDBR : dataItem['cdSDBR'],
	            					cdEntite : dataItem['cdEntite'],
	            					cdSDBLOC : dataItem['cdSDBLOC'],
	            					cdResultatRapproch : dataItem['cdResultatRapproch'],
	            					noPtf : dataItem['noPtf'],
	            					noProduitRapproch : dataItem['noProduitRapproch'],
	            					noCompteRapproch : dataItem['noCompteRapproch'],
	            					cdDevise : dataItem['cdDevise'],
	            					noDossierRapproch : dataItem['noDossierRapproch'],
	            					noOperationRapproch : dataItem['noOperationRapproch'],
	            					cdJustif : dataItem['cdJustif'],
	            					mtNonJustifCtv : dataItem['mtNonJustifCtv'],
	            					mtSoldeBac : dataItem['mtSoldeBac'],
	            					mtSoldeSo : dataItem['mtSoldeSo'],
	            					mtEcart : dataItem['mtEcart'],
	            					mtEcartCtv : dataItem['mtEcartCtv'],
	            					mtJustif : dataItem['mtJustif'],
	            					mtEcartNet : dataItem['mtEcartNet'],
	            					cdGestion : dataItem['cdGestion'],
	            					libJustif : dataItem['libJustif'],
	            					mtJustif : dataItem['mtJustif']
	            				};
	            				sommeMontantJustif = parseFloat(sommeMontantJustif)
	            						+ parseFloat(dataSelected[p].mtJustif);
	            			}
	            			// justification unitaire
	            			if (grid.getSelectedRows().length == 1) {
	            				if (type == "justif") {
	            					if (dataSelected[0].mtJustif != 0) {
	            						document.getElementById('txtAreaPopinJustif').value = dataSelected[0].libJustif;
	            					}
	            					document.getElementById('btJustifTotal').style.display = "block";
	            					document.getElementById("mtJustifTotalContainer").className = "item-details-editor-container";
	            				} else {
	            					document.getElementById('btJustifTotal').style.display = "none";
	            					document.getElementById("mtJustifTotalContainer").className = "item-details-editor-container-readonly";
	            				}
	            			} else {
	            				// dans le cas de la justification par lot, on arrondie le
	            				// montant total qui n'est la que pour info.
	            				mtSoldeTotal = Math.round(mtSoldeTotal * 100) / 100;
	            				// de plus, on ne permet pas la modification du montant à
	            				// justifier qui est forcement total.
	            				document.getElementById('mtJustifTotal').readOnly = true;
	            				document.getElementById("mtJustifTotalContainer").className = "item-details-editor-container-readonly";
	            				document.getElementById('btJustifTotal').style.display = "none";
	            			}
	            			if (type == "justif") {
	            				mtJustifTotal = mtSoldeTotal;
	            				document.getElementById('mtJustifTotal').value = mtJustifTotal
	            						.toLocaleString();
	            			} else {
	            				document.getElementById('mtJustifTotal').value = sommeMontantJustif
	            						.toLocaleString();
	            			}
	            			document.getElementById('mtSoldeTotal').value = mtSoldeTotal
	            					.toLocaleString();
	            			checkedGrid.init();
	            			checkedDataView.beginUpdate();
	            			checkedDataView.setItems(dataSelected);
	            			checkedDataView.endUpdate();
	            		} else {
	            			alert(libelles['minLigneJust']);
	            		}
	            },
	                "No": function () {
	                $(this).dialog('close');
	            }
	        }
	    });
	});
}

**micetf** · 22/02/2016, 19h17

Bonjour,

L'appel de ouvrirJustifDejustif(type,informationMessage) se fait comment ?

**freestyler1982** · 22/02/2016, 19h32

Bonjour,
ouvrirJustifDejustif(type,informationMessage) est dans une autre fonction celle ci est appelé aprés clic sur un bouton ...
L'appel en rouge.

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
function ouvrirDeJustif() {
	document.getElementById("sablierVerification").style.display="block";
	param = "";
	var dataSelected = [];
	var sommeMontantJustif = 0;
	var md_traitement = $('select[name=selectedPeriodiciteValue]').val();
	var limitmaxjustif;
	
	if(md_traitement == 'SJ'){
		limitmaxjustif  = $('#limite_justif_sj').val();
	}else if(md_traitement == 'MD'){
		limitmaxjustif  = $('#limite_justif_md').val();
	}	
	for (var i = 0; i < grid.getSelectedRows().length; i++) {
		var dataItem = [];
		dataItem = dataView.getItem(grid.getSelectedRows()[i]);
		checkedDataView.setItems(dataSelected);
		if (i > 0) {
			param += "&";
		}
		param += "idE" + i + "=" + dataItem['id'];
	}	
	
	document.getElementById("btnJustifier").disabled = false;
	document.getElementById("btnAnnulerJustifier").disabled = false;
	document.getElementById("btnDejustifier").disabled = false;
	document.getElementById("txtAreaPopinJustif").disabled = false;
	document.getElementById("inputPopInJustif").disabled = false;
	document.getElementById("txtAreaPopinJustif").disabled = false;
	document.getElementById("reconductible_checkbox").disabled = false;
	document.getElementById("sablierJustif").style.display = "none";
	document.getElementById("sablierDejustif").style.display = "none";

	if (grid.getSelectedRows().length > 0) {
		if(grid.getSelectedRows().length <= limitmaxjustif) {			
		var infoMessage ="";
		var errorMessage ="";
	
	if(verifTypeJustifForDejustif() != null) {
		if(verifTypeJustifForDejustif()) {
			alert(libelles['NoAndDejaDejustif']);
		} else {

	if (verifAlreadyDeJustif()){
		alert(libelles['alreadyDejustif']);
	} else {
		if (!verifTypeJustif()) {
			alert(libelles['cdDiffAgregats']);
		} else {
		if(!verifCodeJustif()) {
			if(retourErrorAndInformationMessage == 'Erreur') {
				alert(libelles['techErrorInterne']);
			} else {
				var retourErrorAndInformationMessage = controlsBeforeOpeningPopup(param);
				if(retourErrorAndInformationMessage != "" && retourErrorAndInformationMessage != "Erreur") {
					var parsedMessage = JSON.parse(retourErrorAndInformationMessage);
						infoMessage = 	parsedMessage.informationMessage;	
						errorMessage = parsedMessage.errorMessage;
					}
				if(retourErrorAndInformationMessage != "" && retourErrorAndInformationMessage != "Erreur" && typeof errorMessage != "undefined" && typeof infoMessage == "undefined") {
					var message = JSON.parse(retourErrorAndInformationMessage);
					alert(message.errorMessage);
				} else {
					ouvrirJustifDejustif("dejustif",infoMessage); 
				  }
			}
				}
			}
	  	}
	}
} 
	} else{
		alert(libelles['maxLigneJust']+limitmaxjustif);
	}
	} else {
		alert(libelles['minLigneJust']);
	}	
	document.getElementById("sablierVerification").style.display="none";
}

Et l'appel à cette fonction se fait dans une page jsp :

Code :

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

1
2
3
4
5
 
 
				<sweetdev:button value="title.boutton.Dejustifier"
					onclick="ouvrirDeJustif();" styleClass="inputBtFilter"
					titleKey="tip.dejustifier" />

**micetf** · 22/02/2016, 19h39

Tu as encore une erreur dans la console (F12) ?
Au chargement de la page ? Au clique qui déclenche tes appels ?

**freestyler1982** · 22/02/2016, 19h47

Oui j'ai exactement la même erreur citée dans le titre et c'est au clic pas au chargement de la page

TypeError: $(...).dialog is not a function

**micetf** · 22/02/2016, 19h52

Tu as vérifié que jQuery-ui.js était bien chargé ? (Onglet network des devtools)

Le message d'erreur tend à prouver que non. Ou alors la version de jQuery UI utilisée n'intègre pas le widget dialog.

**SpaceFrog** · 23/02/2016, 09h21

Heu ??? ça sert à quoi une fonction qui encadre un ready ... tu n'as pas du aller voir le lien sur "qu'est ce que la notion de ready "...

**freestyler1982** · 23/02/2016, 11h51

Envoyé par micetf

Tu as vérifié que jQuery-ui.js était bien chargé ? (Onglet network des devtools)

Le message d'erreur tend à prouver que non. Ou alors la version de jQuery UI utilisée n'intègre pas le widget dialog.

Oui justement j'ai installé la dernière version Jquery récupérée du site...
par contre j'ai pas compris comment voir si jQuery-ui.js est bien chargé ?

**freestyler1982** · 23/02/2016, 11h53

Envoyé par SpaceFrog

Heu ??? ça sert à quoi une fonction qui encadre un ready ... tu n'as pas du aller voir le lien sur "qu'est ce que la notion de ready "...

Si j'ai regardé votre lien et quand j'ai mis $(document).ready(function() au tout début du fichier js et j'ai pensé à fermer à la fin avec un }); mais le probleme c'est que mes fonctions javascript ne sont plus reconnues...

**freestyler1982** · 23/02/2016, 12h00

Envoyé par micetf

Tu as vérifié que jQuery-ui.js était bien chargé ? (Onglet network des devtools)

Le message d'erreur tend à prouver que non. Ou alors la version de jQuery UI utilisée n'intègre pas le widget dialog.

Efffectivement je vois que le jQuery-ui.js n'a pas été chargé et pourtant j'ai actualiser mon projet et fait le clean et redémarrer et les serveurs et mon navigateur.

**micetf** · 23/02/2016, 12h20

Avec un Ctrl-U (code source de la page web), les lignes ci-dessous donnent quoi ?
Est-ce que les src pointent bien vers des fichiers qui existent ?

Code :

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

1
2
3
4
 
 <script src="${pageContext.request.contextPath}/slickgrid/lib/jquery.js"></script> 
 <script src="${pageContext.request.contextPath}/slickgrid/lib/jquery-ui.js"></script> 
 <script src="${pageContext.request.contextPath}/slickgrid/lib/jquery-ui.min.js"></script>

Remarque : Il faudrait choisir entre la version uncompressed et la version minified de jQuery-UI.

**freestyler1982** · 23/02/2016, 13h10

Merci j'ai la confirm box avec le title qu'il faut et les deux bouton ^^
seul problème j'arrive à pas à voir le contenu de la confirm dialog (pas de message au contenu), et comme la confirm dialog s'affiche au dessus d'un tableau slickgrid .... elle est transparente et à travers elle j'arrive à cliquer sur les cellules du tableau :/

y a moyen qu'elle soit en premier plan et active ... et surtout comment afficher le message dans son contenu..

**micetf** · 23/02/2016, 13h39

Envoyé par freestyler1982

y a moyen qu'elle soit en premier plan et active ... et surtout comment afficher le message dans son contenu..

C'est dans les options du widget que cela peut se gérer (cf. doc jQuery UI) :

Code jQuery :

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

1
2
3
4
5
6
7
8
9
10
 
$("#dialog-confirm").dialog({
        ...
        modal: true, // Les autres éléments de la page sont désactivés
        ...
        open: function () {
            $(this).text("Le message qui s'affichera à l'ouverture");
        },
        ...
});

TypeError: $()dialog is not a function

jQuery

Discussions similaires

Partager

Partager