Discussion :

[cyclopsnet]

Bonjour,
J'ai le problème suivant :
quand je selectionne un élement dans un select par exemple 'date' il faut qu'un input s'affiche avec un masque de saisie de type DD/MM/AAAA pour moi l'input s'affiche mais le masque non
Voila mon code :
fichier affiche.jsp:

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
for(int i=0;i<champs.size();i++){                                       
                    out.println("<tr>");
                    out.println("<td align='center'>");
                    out.println("<select id='operateur' name='operateur' onchange='go()' disabled='true'>");
                    out.println("<option value=''></option>");
                    out.println("<option value='='>=</option>");
                    out.println("<option value='<'><</option>");
                    out.println("<option value='>'>></option>");
                    out.println("<option value='<=>'><=></option>");
                    out.println("<option value='IN'>IN</option>");
                    out.println("</select>");
                    out.println("</td>");
                    out.println("<td align='left'><div id='div1'></div></td>");
                    out.println("</tr>");                                     
                    }
                %>

le code ajax :

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
<script type='text/javascript'>
            function getXhr(){
                                var xhr = null;
				if(window.XMLHttpRequest) // Firefox et autres
				   xhr = new XMLHttpRequest();
				else if(window.ActiveXObject){ // Internet Explorer
				   try {
			                xhr = new ActiveXObject("Msxml2.XMLHTTP");
			            } catch (e) {
			                xhr = new ActiveXObject("Microsoft.XMLHTTP");
			            }
				}
				else { // XMLHttpRequest non supporté par le navigateur
				   alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
				   xhr = false;
				}
                                return xhr;
			}

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
function go(){
				 var xhr = getXhr();
				// On défini ce qu'on va faire quand on aura la réponse
				xhr.onreadystatechange = function(){
					// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
					 if(xhr.readyState == 4 && xhr.status == 200){
						 leselect = xhr.responseText;
						// On se sert de innerHTML pour rajouter les options a la liste
						 document.getElementById('div1').innerHTML = leselect;
					}
				 }
 
				// Ici on va voir comment faire du post
				 xhr.open('POST','js/value.jsp',true);
				// ne pas oublier ça pour le post
				 xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
				// ne pas oublier de poster les arguments
				// ici, l'id de l'auteur
				 sel = document.getElementById('operateur_"+i+"');
				 id_n = sel.options[sel.selectedIndex].value;
				 xhr.send('id_n='+id_n);
			 };

Pour le mask j'utilise la librérie jquery.maskedinput-1.2.2.js

Code :

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

1
2
3
4
5
<script language="Javascript">
jQuery(function($){
   $("#date").mask("99/99/9999");
});
</script>

Mon fichier value.jsp:

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
<%
String opr;
 
opr=request.getParameter("id_n");
if(opr.equals("=")){
    out.print("<input type='text' name='' size='15'>");
    }
if(opr.equals("<")){
    out.print("<input type='text' name='' size='15'>");
    }
if(opr.equals(">")){
    out.print("<input type='text' name='' size='15'>");
    }
if(opr.equals("<=>")){
    out.print("<input type='text' id='date' name='valeur' >");
    }
if(opr.equals("IN")){
    out.print("<input type='text' name='' size='15'>");
    }
%>

Veuillez m'aider pour résoudre ce problème.Merci

[Bovino]

Code :

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

1
2
3
sel = document.getElementById('operateur_"+i+"');
id_n = sel.options[sel.selectedIndex].value;
xhr.send('id_n='+id_n);

Tu as vraiment un champ dont l'id est : operateur_"+i+" ???
Tu ne veux pas plutôt dire :

Code :

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

1
2
3
sel = document.getElementById('operateur_'+i);
id_n = sel.options[sel.selectedIndex].value;
xhr.send('id_n='+id_n);

Qui récupérera l'élément dont l'identifiant est operateur_undefined puisque manifestement, i n'est pas défini...

[cyclopsnet]

dsl voila le bon code :

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
var xhr = getXhr();
				// On défini ce qu'on va faire quand on aura la réponse
				xhr.onreadystatechange = function(){
					// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
					 if(xhr.readyState == 4 && xhr.status == 200){
						 leselect = xhr.responseText;
						// On se sert de innerHTML pour rajouter les options a la liste
						 document.getElementById('div1').innerHTML = leselect;
					}
				 }
 
				// Ici on va voir comment faire du post
				 xhr.open('POST','js/value.jsp',true);
				// ne pas oublier ça pour le post
				 xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
				// ne pas oublier de poster les arguments
				// ici, l'id de l'auteur
				 sel = document.getElementById('operateur');
				 id_n = sel.options[sel.selectedIndex].value;
				 xhr.send('id_n='+id_n);
			 };

[Bovino]

Bon, ben maintenant, ce que je ne comprends pas, c'est comment tu peux lancer ta fonction avec :

Code :

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

<select id='operateur' name='operateur' onchange='go()' disabled='true'>

Si ton select est disabled, tu ne peux pas le modifier, donc tu ne peux pas déclencher le onchange...

[cyclopsnet]

dans mes test j'enleve le parametre disabled du select

[Bovino]

Si j'en crois les value de tes options, il faut considérer que certains caractères ('<' et '>' en particulier) passent mal dans l'URL, encode-les correctement :

Code :

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

id_n = encodeURIComponent(sel.options[sel.selectedIndex].value);