plusieurs str=prompt et fonction non démarré

**rvm31** · 02/11/2012, 22h59

bonjour

j'essaye de modifier un script dont j'avais cru comprendre le fonctionnement.
Mais apparemment ce n'est pas le cas.
dans 2 champs différents select d'un formulaire je veux une fenêtre prompt si une valeur est choisie.
la première fonction valeur(test1) fonctionne mais le deuxième prod(newprod) la console d'erreur firefox me dit qu'elle n'est pas démarré.

Et pour ma première fonction si j'affiche la fenêtre avec le résultat du prompt par le choix adéquat du select, je n'arrive pas à la ré-effacer si je fais un autre choix dans le select.

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
  <script type="text/javascript">
    function valeur(test1){
	i = document.getElementById("nouvoclient").options.length;
 
	if (test1=='autrec'){
		var str= prompt("Indiquer ici le nouveau client","");
		document.getElementById('newc1').value=str;
		document.getElementById('newclient').style.visibility="visible";
	}
 
	if (test1 != "autrec") document.getElementById("autre").options.length = i;
}
 
function prod(newprod){
i = document.getElementById("nprod").options.length;
 
	if (newprod=='autrep'){
		var str= prompt("Indiquer ici la nouvelle prod","");
		document.getElementById('newprod1').value=str;
		document.getElementById('newproduction').style.visibility="visible";
	}
 
	if (newprod != "autrep") document.getElementById("autreprod").options.length = i;
}
 
 
</script>

1er select qui fonctionne mais qui n'efface pas la fenêtre si je change mon choix

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
 echo"Client<br><select name='client'div class='champselect' id='nouvoclient' onChange='valeur(this.value)'>";
  //insertion d'un champ vide (client indefini)
echo"<option value='non'>Ind&eacute;fini</option>";
echo"<option value='autrec'>Nouveau client &agrave; pr&eacute;ciser</option>";
$sql= 'SELECT *  FROM `list_client`  ORDER BY client';
$resultat=mysql_query($sql);
while ($listeclient = mysql_fetch_assoc($resultat)){
    if(!empty($listeclient['client'])){
        $selected = ($listeclient['client']==$client)? ' selected="selected"' : '';
 echo '<option value="'.$listeclient['client'].'"'.$selected.'">'.$listeclient['client'].'</option>';
}}
<font style='visibility: hidden' id='newclient'>nouveau client:<br><input name='newc2' id='newc1'></font>

2e select non démarré

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
 <?php
  echo"<select name='prod'div class='champselect' id='nprod' onChange='prod(this.value)'>";
 
  //insertion d'un champ vide (prod indefini)
echo"<option value='non d&eacute;fini'>Ind&eacute;fini</option>";
echo"<option value='autrep'>Nouvelle prod &agrave; pr&eacute;ciser</option>";
$sql= 'SELECT *  FROM `list_prod`  ORDER BY prod';
$resultat=mysql_query($sql);
while ($listeprod = mysql_fetch_assoc($resultat)){
    if(!empty($listeprod['prod'])){
        $selected = ($listeclient['prod']==$producteur)? ' selected="selected"' : '';
 echo '<option value="'.$listeprod['prod'].'"'.$selected.'">'.$listeprod['prod'].'</option>';
}
}
?>
 <font style='visibility: hidden' id='newproduction'>nouvelle prod:<br><input name='newprod' id='newprod1'></font>
</td>

**NoSmoking** · 03/11/2012, 09h52

Bonjour,
merci de mettre le code HTML généré et non le code PHP

http://www.developpez.net/forums/d73...isation-forum/

**rvm31** · 03/11/2012, 14h06

voici donc le script

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
   <script type="text/javascript">
    function valeur(test1){
	i = document.getElementById("nouvoclient").options.length;
 
	if (test1=='autrec'){
		var str= prompt("Indiquer ici le nouveau client","");
		document.getElementById('newc1').value=str;
		document.getElementById('newclient').style.visibility="visible";
	}
 
	if (test1 != "autrec") document.getElementById("autre").options.length = i;
}
 
function prod(newprod){
i = document.getElementById("nprod").options.length;
 
	if (newprod=='autrep'){
		var str= prompt("Indiquer ici la nouvelle prod","");
		document.getElementById('newprod1').value=str;
		document.getElementById('newproduction').style.visibility="visible";
	}
 
	if (newprod != "autrep") document.getElementById("autreprod").options.length = i;
}
 
 
</script>

et le code source généré par le navigateur

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
<!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">
 
 
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
    <script type="text/javascript">
    function valeur(test1){
        i = document.getElementById("nouvoclient").options.length;
 
        if (test1=='autrec'){
                var str= prompt("Indiquer ici le nouveau client","");
                document.getElementById('newc1').value=str;
                document.getElementById('newclient').style.visibility="visible";
        }
 
        if (test1 != "autrec") document.getElementById("autre").options.length = i;
}
 
function prod(newprod){
i = document.getElementById("nprod").options.length;
 
        if (newprod=='autrep'){
                var str= prompt("Indiquer ici la nouvelle prod","");
                document.getElementById('newprod1').value=str;
                document.getElementById('newproduction').style.visibility="visible";
        }
 
        if (newprod != "autrep") document.getElementById("autreprod").options.length = i;
}
 
 
</script>
<title>insertion d'un nouveau master</title>
<link href="style.css" rel="stylesheet" type="text/css" />
<style type="text/css">
 
</style>
 
</head>
 
<body>
 
<!--en tï¿½te -->
<div class="container">
 
<form action="master-insert2.php" method="post">
 
 
    <table  cellspacing="3" cellpadding="3" width="100%">
 
   <!--CIENT-->
   <td width="10%">
   Client<br><select name='client'div class='champselect' id='nouvoclient' onChange='valeur(this.value)'>
<option value='non'>Ind&eacute;fini</option>
<option value='autrec'>Nouveau client &agrave; pr&eacute;ciser</option></td>
   <td width="40px"><font style='visibility: hidden' id='newclient'>nouveau client:<br><input name='newc2' id='newc1'></font></td>
 <td width="300px">
 
   <!--prod -->
   <td valign="top"><label >PRODUCTION</label><br>
       <select name='prod'div class='champselect' id='nprod' onChange='prod(this.value)'>
<option value='non d&eacute;fini'>Ind&eacute;fini</option>
<option value='autrep'>Nouvelle prod &agrave; pr&eacute;ciser</option> <font style='visibility: hidden' id='newproduction'>nouvelle prod:<br><input name='newprod' id='newprod1'></font>
</td>

**NoSmoking** · 03/11/2012, 15h35

il y a pas mal de maladresse dans ton code et je vais commencer par la première qui fait planter IE

Code html :

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

<select name='prod'div class='champselect' id='nprod' onChange='prod(this.value)'>

fonction avec le même nom qu'un élément, IE n'aime pas!

Autre morceau choisi

Code html :

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

1
2
3
4
5
6
<td width="10%">
  Client<br>
  <select name='client'div class='champselect' id='nouvoclient' onChange='valeur(this.value)'>
    <option value='non'>Ind&eacute;fini</option>
    <option value='autrec'>Nouveau client &agrave; pr&eacute;ciser</option>
</td>

le HTML n'est pas conforme, manque la balise fermant </select>

Juste à la suite on trouve

Code html :

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

1
2
3
<td width="40px">
  <font style='visibility: hidden' id='newclient'>nouveau client:<br><input name='newc2' id='newc1'></font>
</td>

font n'est pas un élément mais un balisage de style OBSOLETE.
A remplacer par une DIV par exemple pour que le code puisse l'afficher/masquer.

Les mêmes remarques s'applique à ton deuxième SELECT.

Je pense qu'il est préférable de corriger ces points avant de continuer.

**rvm31** · 03/11/2012, 21h57

merci no smoking, j'ai corrigé les erreurs, désolé pour

le HTML n'est pas conforme, manque la balise fermant </select>

si j'avais les yeux en face des trous je l'aurais vu

je code JS est donc maintenant.

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
  <script type="text/javascript">
    function valeur(test1){
	i = document.getElementById("nouvoclient").options.length;
 
	if (test1=='autrec'){
		var str= prompt("Indiquer ici le nouveau client","");
		document.getElementById('newc1').value=str;
		document.getElementById('newclient').style.visibility="visible";
	}
 
	if (test1 != "autrec") document.getElementById("autre").options.length = i;
}
 
function production(newprod){
i = document.getElementById("laprod").options.length;
 
	if (newprod=='autrep'){
		var str= prompt("Indiquer ici la nouvelle prod","");
		document.getElementById('newprod1').value=str;
		document.getElementById('newproduction').style.visibility="visible";
	}
 
	if (newprod != "autrep") document.getElementById("autreprod").options.length = i;
}
 
 
</script>

la source

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
 <!--CLIENT-->
   <td width="10%">
   Client<br><select name='client'div class='champselect' id='nouvoclient' onChange='valeur(this.value)'>
<option value='non'>Ind&eacute;fini</option>
<option value='autrec'>Nouveau client &agrave; pr&eacute;ciser</option></select>  </td>
   <td width="40px"><div style='visibility: hidden' id='newclient'>nouveau client:<br><input name='newc2' id='newc1'></div></td>
 
 <!--prod -->
   <td valign="top"><label >PRODUCTION</label><br>
       <select name='prod'div class='champselect' id='laprod' onChange='production(this.value)'>
<option value='non d&eacute;fini'>Ind&eacute;fini</option>
<option value='autrep'>Nouvelle prod &agrave; pr&eacute;ciser</option></select> 
<div style='visibility: hidden' id='newproduction'><input name='newprod' id='newprod1'></div>
</td>

ce qui ne fonctionne pas encore c'est la disparition du champ qui était en hidden au départ.
Lorsque je l'affiche par le bon sélect, si je change mon select il reste affiché.

La console de débuggage du navigateur me renvoie ça

TypeError: 'null' is not an object (evaluating 'document.getElementById("autreprod").options')

si je comprend bien le JS ne récupère pas les variables PHP et ne peut donc pas changer l'état de l'affichage.

**NoSmoking** · 04/11/2012, 09h23

Envoyé par rvm31

La console de débuggage du navigateur me renvoie ça

TypeError: 'null' is not an object (evaluating 'document.getElementById("autreprod").options')

Il n'existe simplement pas d'élément ayant autreprod comme ID dans ton document.

**rvm31** · 04/11/2012, 22h35

j'ai modifié le code du JS comme suit pour afficher et masquer les fenêtres affichant les valeurs du prompt.
le code est récupéré sur internet mais je n'ai pas compris a quoi servait les .options.length, ou on pourrait dire également que je n'ai pas compris comment les mettre en oeuvre.
j'ai donc rajouter un .style.visibility="hidden" pour masquer le fenêtre tout marche impeccable.

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
<script type="text/javascript">
    function valeur(test1){
	i = document.getElementById("nouvoclient");
 
	if (test1=='autrec'){
		var str= prompt("Indiquer ici le nouveau client","");
		document.getElementById('newc1').value=str;
		document.getElementById('newclient').style.visibility="visible";
	}
 
	if (test1 != "autrec") {
            document.getElementById("nouvoclient");
        document.getElementById('newclient').style.visibility="hidden";
    }
}
 
function production(newprod){
i = document.getElementById("laprod");
 
	if (newprod=='autrep'){
		var str= prompt("Indiquer ici la nouvelle prod","");
		document.getElementById('newprod1').value=str;
		document.getElementById('newproduction').style.visibility="visible";
	}
 
	if (newprod != "autrep") {
            document.getElementById("laprod");
           document.getElementById('newproduction').style.visibility="hidden";
        }
}
 
 
</script>

**NoSmoking** · 05/11/2012, 18h32

je n'ai pas compris a quoi servait les .options.length

je n'ai pas regardé vraiment le contexte mais cela permet de supprimer des OPTIONs d'un SELECT en en réduisant indirectement leur nombre.

plusieurs str=prompt et fonction non démarré

JavaScript

Discussions similaires

Partager

Partager