Dialog et fonctions jQuery
Bonjour,
Je me permet de poster ici après moulte tentative pour faire fonctionner mon code. J'utilise JQUERY et UI-APIG pour faire apparaître un formulaire dans une boite de dialog.
Tout fonctionne très bien la première fois, seulement, lors de la ré-ouverture du formulaire en boîte de dialog, mes fonctions jquery sur les select (type onchange) ainsi que le bouton valider ne fonctionne plus.
Je ne trouve malheureusement pas de solution.
Je vous poste ici mon code dans l'espoir qu'une personne aura la solution à mon problème :
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
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
| <?php
session_start();
if ($_SESSION['login'] == '')
{
header('Location: index.php');
}
//Recherche des valeurs pour les select de départ
include("includes/connexion.php");
$sql = "SELECT DISTINCT typeMateriel FROM wetp_materieles ORDER BY typeMateriel";
$req1 = mysql_query($sql) or die('Erreur SQL : <br />'.$sql);
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<head>
<title>/</title>
<meta name="author" content="/" />
<meta name="keywords" content="OPTIMISATION, MAGASIN, VEHICULE, STOCK, ENTRETIEN" />
<meta name="description" content="Outil de gestion" />
<link href="template/template.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" media="all" type="text/css" href="jqueryui/jquery-ui.css">
<LINK REL="SHORTCUT ICON" href="template/iconT.icon">
<script type="text/javascript" src="jquery/jquery.js"></script>
<script src="function/jquery_gestionStock.js"></script>
<script src="function/pageloader.js"></script>
<script type="text/javascript" src="jqueryui/jquery-ui.js"></script>
<script type="text/javascript" src="jqueryui/jquery.ui.datepicker-fr.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$( "#datepicker" ).datepicker($.datepicker.regional["fr"]);
$( "#datepickerRetour" ).datepicker($.datepicker.regional["fr"]);
$( "#datepickerRecherche" ).datepicker($.datepicker.regional["fr"]);
});
</script>
</head>
<body>
<div id="chargement">Chargement...<span id="chargement-infos"></span></div>
<div id="container">
<a href='index.php'>
<div id="wetpLOGO">
</div>
</a>
<!-- Lien appartenant au module ES Materiel -->
<div id="linkES">
<a href="tableauBord.php">
<div id="tableauBord">
</div>
</a>
<a href="#">
<div id="material">
</div>
</a>
<a href="#">
<div id="inventaire">
</div>
</a>
<a href="#">
<div id="transaction">
</div>
</a>
</div>
<a id="openMenu" href="#">
<div id="menu">
</div>
</a>
<!-- Page de visualisation du module entrée sortie matériel avec la liste du matériel sortie -->
<div id="rechercheMateriel1">
</div>
<div id="rechercheMateriel2">
<form name="rechercheFicheMateriel" id="rechercheFicheMateriel" accept-charset="ISO-8859-1" action="#" accept-charset="UTF-8">
<table id="tableRechercheMateriel" border="0" width="60%" align="center" bgcolor="#E3E3E3" style="position:absolute;top:12%;left:20%;border:1px solid #DB9393;border-radius: 0px;">
<tr>
<td align='center'>
<input type='text' name='identifiantMateriel' id='identifiantMateriel' value='Matériel :' style='width:300px;height:28px;border-radius:0px;'readonly/><button id='openRecherche' name='openRecherche'>?</button>
</td>
</tr>
</table>
</form>
<div id='menuMateriel'>
<a href='#' name='general' id='general' style="position:absolute;width:80px;top:20%;left:20%;background-color:#AFD8F3;border:1px solid #76C1F3;border-radius: 0px;text-align:center;border-top-left-radius:10px;border-top-right-radius:10px;text-decoration:none;">
Général
</a>
<a href='#' name='documents' id='documents' style="position:absolute;width:80px;top:20%;left:26%;background-color:#E3E3E3;border:1px solid #E3E3E3;border-radius: 0px;text-align:center;border-top-left-radius:10px;border-top-right-radius:10px;text-decoration:none;">
Documents
</a>
<a href='#' name='interventions' id='interventions' style="position:absolute;width:90px;top:20%;left:32%;background-color:#E3E3E3;border:1px solid #E3E3E3;border-radius: 0px;text-align:center;border-top-left-radius:10px;border-top-right-radius:10px;text-decoration:none;">
Interventions
</a>
<a href='#' name='historique' id='historique' style="position:absolute;width:80px;top:20%;left:38.6%;background-color:#E3E3E3;border:1px solid #E3E3E3;border-radius: 0px;text-align:center;border-top-left-radius:10px;border-top-right-radius:10px;text-decoration:none;">
Historique
</a>
</div>
<div id='contenugeneral' style="position:absolute;width:60%;height:20%;top:22.7%;left:20%;border:1px solid #76C1F3;border-radius: 0px;text-align:center;text-decoration:none;">
</div>
<div id='contenudocuments' style="position:absolute;width:60%;height:20%;top:22.7%;left:20%;border:1px solid #76C1F3;border-radius: 0px;text-align:center;text-decoration:none;">
</div>
<div id='contenuinterventions' style="position:absolute;width:60%;height:20%;top:22.7%;left:20%;border:1px solid #76C1F3;border-radius: 0px;text-align:center;text-decoration:none;">
</div>
<div id='contenuhistorique' style="position:absolute;width:60%;height:20%;top:22.7%;left:20%;border:1px solid #76C1F3;border-radius: 0px;text-align:center;text-decoration:none;">
</div>
</div>
<div id="dialog-form" title="Recherche d'une fiche véhicule">
<p class="validateTips">Sélectionner le véhicule en remplissant les champs.</p>
<form accept-charset="UTF-8">
<fieldset>
<label for="typeVehicule">Type véhicule</label>
<select name="typeVehicule" id="typeVehicule" class="text ui-widget-content ui-corner-all">
<option value="value1">Type véhicule</option>
<?php
While ($donnee = mysql_fetch_assoc($req1))
{
echo "<option value='".$donnee['typeMateriel']."'>".$donnee['typeMateriel']."</option>";
}
?>
</select>
<label for="marque">Marque</label>
<select name="marque" id="marque" class="text ui-widget-content ui-corner-all">
<option value="value1">Marque</option>
</select>
<label for="identifiant">Immatriculation</label>
<select name="identifiant" id="identifiant" class="text ui-widget-content ui-corner-all">
<option value="value1">Immatriculation</option>
</select>
<input type="submit" tabindex="-1" style="position:absolute; top:-1000px">
</fieldset>
</form>
</div>
</div>
</body>
</html> |
Code JS :
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
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
| // --------------------------------------------------------------------
// ----------- Le code JQUERY pour les animations de la page ----------
// --------------------------------------------------------------------
// Le DOM est pret
$(document).ready(function() {
$.pageLoader();
dialogFunction = $("#dialog-form").dialog({
autoOpen: false,
modal: true,
buttons: {
"Valider": function() {
$.ajax({ // fonction permettant de faire de l'ajax
type: "POST", // methode de transmission des données au fichier php
url: "includes/mod_Gestion_rechercheDonnee.php?value=" + $("#identifiant").val() , // url du fichier php
success: function(msg)
{ // si l'appel a bien fonctionné
$("#contenugeneral").html(msg);
}
});
$("#identifiantMateriel").val($("#typeVehicule").val() + " - " +$("#marque").val() + " - " +$("#identifiant").val());
$(this).dialog("close");
},
"Quitter": function() {
$(this).dialog("close");
}
}
});
$("#openRecherche").button().on("click", function() {
$("#identifiantMateriel").val("...");
dialogFunction.dialog("open");
});
$("#typeVehicule").change(function() {
$.ajax({ // fonction permettant de faire de l'ajax
type: "POST", // methode de transmission des données au fichier php
url: "includes/mod_Gestion_MarqueVehicule.php?value=" + $("#typeVehicule").val() , // url du fichier php
success: function(msg)
{ // si l'appel a bien fonctionné
$("#marque").html(msg);
}
});
return false; // permet de rester sur la même page à la soumission du formulaire
});
$("#marque").change(function() {
$.ajax({ // fonction permettant de faire de l'ajax
type: "POST", // methode de transmission des données au fichier php
url: "includes/mod_Gestion_ImmatVehicule.php?value=" + $("#marque").val()+"&value1=" + $("#typeVehicule").val() , // url du fichier php
success: function(msg)
{ // si l'appel a bien fonctionné
$("#identifiant").html(msg);
}
});
return false; // permet de rester sur la même page à la soumission du formulaire
});
});<br><br> |
Je pense que si il y a un probleme il devrait se situer dans ces lignes.
Merci par avance pour votre aide
