[AJAX] document.getElementById() is null

**nicocooper** · 30/03/2011, 15h31

bonjour, débutant dans les routines ajax et javascript,
je galère depuis plusieurs jours sur ce code, qui est un formulaire de saisie d'une intervention, qui charge entre autres des listes déroulantes liées entre elle et cela marche bien.
Mais je voudrais faire un calcul automatique et l'afficher en fonction des saisies de l'utilisateur et des résultats de mes requètes.
lorsque j'appelle ma fonction actu() il me donne une erreur javascript document.getElementById("Duree") is null...
idem pour document.getElementById("Solde_Restant") is null.

voici mon code en partie car trop long de copier tous les autres fichiers, mais si vous avez besoins d'autres infos, n'hésitez pas...
merci aux âmes charitables qui voudront bien me sortir de ce bourbier.

Code html :

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
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-15" />
<link rel="stylesheet" href="calendrier/calendrier.css" type="text/css" />
 
<script src="js/sql.js" type="text/javascript"></script>
<script type="text/javascript">
function valider(){
        frm=document.forms['forminter'];
        var msg="Saisissez";
 
if (frm.elements['No_Societe'].value == "-1") {msg+= " Une Société,";}
if (frm.elements['No_Contrat'].value == "-1") {msg+= " Un Contrat,";}
if (frm.elements['No_Contact'].value == "-1") {msg+= " Un Contact,";}
if (frm.elements['Date_Intervention'].value ==""){msg+= " une date,";}
if (frm.elements['Duree'].value =="") {msg+= "une durée,";}
if (frm.elements['No_Nature_Intervention'].value =="-1") {msg+= " une Nature d'intervention,";}
 
if (msg == "Saisissez") {return(true);}
        else    {
                alert(msg);
                return(false);
        }
}
</script>
</head>
 
<body>
<?php
// Include de la connexion sql
 
include("config.php");
include('connectmysql.php');
 
 
?>
		<form  enctype="multipart/form-data" method="post" action="creat_intervention.php" name="forminter" onSubmit="return valider()">
			<fieldset style="width: 600px">
				<legend>Saisie d'une Intervention</legend>
				<div><label>Soci&eacute;t&eacute;</label>
				<select name='societe' id='No_Societe' onchange='go()'>
					<option value='-1'>Aucun</option>
					<?php
                                                $res = mysql_query("SELECT * FROM $tab order by Societe;");
                                                while($row = mysql_fetch_assoc($res)){
                                                        echo "<option value='".$row["No_Societe"]."'>".$row["Societe"]."</option>";
                                                }
                                        ?>
				</select>
                 <label>Contacts</label>
				<div id='No_Contact' style='display:inline'>
				<select name='No_Contact'>
					<option value='-1'>Choisir une soci&eacute;t&eacute;</option>
				</select>
				</div>
                </div><br/>
				<label>No Contrat</label>
				<div id='No_Contrat' style='display:inline'>
				<select name='No_Contrat' id='Contrat' >
					<option value='-1'>Choisir une soci&eacute;t&eacute;</option>
				</select>
				</div>
                <label>Solde Actuel :</label>
				<div id='Solde_Restant' name="Solde_Restant" style='display:inline'>
                </div>
 
 
                <p><label>Date d'Intervention :</label>
    			<input type="text" class="mCalendarFR" name="Date_Intervention" value=""></p>
 
 
                <div><label>Nature Intervention :</label>
    			<select name='No_Nature_Intervention' id='No_Nature_Intervention' onchange='go2()' >
				<option value='-1'>Choisir une Nature Intervention</option>
				<?php
                                $res1 = mysql_query("SELECT * FROM $tab3;");
                                                while($row2 = mysql_fetch_assoc($res1)){
                                                        echo "<option value='".$row2["No_Nature_Intervention"]."'>".$row2["Nature_Intervention"]."</option>";
                                                }
                                        ?>
				</select>
 
  				<label>Taux Horaire :</label>
				<div id='horaire' style='display:inline'>
 
				<select name='Horaire' id='selhoraire'>
					<option value='-1'>Aucun</option>
				</select>
				</div>
 
  				</div><br/>
                <label>Forfait D&eacute;placement :</label>
				<div id='deplacement' style='display:inline'>
                </div>
                <p><label>Dur&eacute;e :</label>
    			<input type="texte" name="Duree" value=""  onchange='actu()'></p>
 
                <p><label>Solde Futur :</label>
    			<input type="texte" name="Solde_Futur" value="Solde_Restant"></p>
 
  				<p><label>D&eacute;tail Intervention :</label><br/>
    			<textarea name="Detail_Intervention" cols="50"></textarea></p>
 
			</fieldset>
		<p>
    <input type="submit" name="submit" value="envoyer">
        <a href="navi.htm"><input name="Submit2" type="reset"  value="Annuler"></a>
 
  </p>
</form>
 
    <script src="calendrier/mCalandar.js" type="text/javascript"></script>
    <script type="text/javascript">
        function actu(){
                                var depart =0;
                                var duree=0;
                                var tauxhoraire=0;
                                var nbheure=0;
                                var Solde_Futur=0;
                                
                                function calcul(){
                                depart=document.getElementById('Solde_Restant').value;
                                duree=document.getElementById('Duree').value;
                                tauxhoraire=document.getElementById('selhoraire').value;
                                nbheure= duree /60;
                                document.getElementById('Solde_Futur').value =depart - (nbheure*tauxhoraire);}
                                
                                calcul();
                                
                                return ;
                                
                                
                                }</script>
    </body>
</html>