recuperer input select sans sumbit

**diengkals** · 29/08/2013, 14h25

bonjour j'ai un formulaire qui récupère des adresses (rue) d'une ville , je veux lorsque je sélectionne une adresse je récupère l'adresse de la ville sans faire un button de submit.

c'est à dire envoyer au serveur mes adresse sans sumbit pour pouvoir recuperer une autre page php

voici mon code html

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
 
<table id="liste_agent">   
           <div>
	       <form action="#" method="POST"  >
		    <select name="address" id="address"  >
			 <option value="-1">selctionner un axe</option>
	<option value="AV.CHARLES DEGAULE">AV.CHARLES DEGAULE</option><option value="AV. MOCTAR OULD DADAH">AV. MOCTAR OULD DADAH</option><option value="AV.GAMAL  ABDEL NASER">AV.GAMAL  ABDEL NASER</option>
		  </select>
		 </form>
 
    </div>		 
		 <tr>
		        <th>Code Agent</th>
				<th>Liste</th>
				<th>GE-MoyE</th>
				<th>PE-MicroE</th>
				<th>PHARMACIE</th>
				<th>DIVERS</th>
 
		</tr>
		    		<tr>
		    <td> 00</td>
			<td><a href="#" class="popup-light" data-popup-class="popup-block" data-popup-width="500px"  id="00">les societes des agents </a> </td>
			<td><a href="cartographie_ge_me.php?id=00"   id="00"  target="_blank">Carte </a> </td>
			<td><a href="cartographie_pe_micro.php?id=00 "    id="00"  target="_blank">Carte </a> </td>
			<td><a href="cartographie_pharm.php?id=00"    id="00"  target="_blank">Carte </a> </td>
			<td><a href="cartographie_divers.php?id=00"    id="00"  target="_blank">Carte </a> </td>
		</tr>
		    		<tr>
		    <td> 01</td>
			<td><a href="#" class="popup-light" data-popup-class="popup-block" data-popup-width="500px"  id="01">les societes des agents </a> </td>
			<td><a href="cartographie_ge_me.php?id=01"   id="01"  target="_blank">Carte </a> </td>
			<td><a href="cartographie_pe_micro.php?id=01 "    id="01"  target="_blank">Carte </a> </td>
			<td><a href="cartographie_pharm.php?id=01"    id="01"  target="_blank">Carte </a> </td>
			<td><a href="cartographie_divers.php?id=01"    id="01"  target="_blank">Carte </a> </td>
		</tr>
		    		<tr>
		    <td> 02</td>
			<td><a href="#" class="popup-light" data-popup-class="popup-block" data-popup-width="500px"  id="02">les societes des agents </a> </td>
			<td><a href="cartographie_ge_me.php?id=02"   id="02"  target="_blank">Carte </a> </td>
			<td><a href="cartographie_pe_micro.php?id=02 "    id="02"  target="_blank">Carte </a> </td>
			<td><a href="cartographie_pharm.php?id=02"    id="02"  target="_blank">Carte </a> </td>
			<td><a href="cartographie_divers.php?id=02"    id="02"  target="_blank">Carte </a> </td>
		</tr>
		    		<tr>
		    <td> 03</td>
			<td><a href="#" class="popup-light" data-popup-class="popup-block" data-popup-width="500px"  id="03">les societes des agents </a> </td>
			<td><a href="cartographie_ge_me.php?id=03"   id="03"  target="_blank">Carte </a> </td>
			<td><a href="cartographie_pe_micro.php?id=03 "    id="03"  target="_blank">Carte </a> </td>
			<td><a href="cartographie_pharm.php?id=03"    id="03"  target="_blank">Carte </a> </td>
			<td><a href="cartographie_divers.php?id=03"    id="03"  target="_blank">Carte </a> </td>
		</tr>
		    		<tr>
		    <td> 04</td>
			<td><a href="#" class="popup-light" data-popup-class="popup-block" data-popup-width="500px"  id="04">les societes des agents </a> </td>
			<td><a href="cartographie_ge_me.php?id=04"   id="04"  target="_blank">Carte </a> </td>
			<td><a href="cartographie_pe_micro.php?id=04 "    id="04"  target="_blank">Carte </a> </td>
			<td><a href="cartographie_pharm.php?id=04"    id="04"  target="_blank">Carte </a> </td>
			<td><a href="cartographie_divers.php?id=04"    id="04"  target="_blank">Carte </a> </td>
		</tr>
		    		<tr>
		    <td> 05</td>
			<td><a href="#" class="popup-light" data-popup-class="popup-block" data-popup-width="500px"  id="05">les societes des agents </a> </td>
			<td><a href="cartographie_ge_me.php?id=05"   id="05"  target="_blank">Carte </a> </td>
			<td><a href="cartographie_pe_micro.php?id=05 "    id="05"  target="_blank">Carte </a> </td>
			<td><a href="cartographie_pharm.php?id=05"    id="05"  target="_blank">Carte </a> </td>
			<td><a href="cartographie_divers.php?id=05"    id="05"  target="_blank">Carte </a> </td>
		</tr>
		    		<tr>
		    <td> 06</td>
			<td><a href="#" class="popup-light" data-popup-class="popup-block" data-popup-width="500px"  id="06">les societes des agents </a> </td>
			<td><a href="cartographie_ge_me.php?id=06"   id="06"  target="_blank">Carte </a> </td>
			<td><a href="cartographie_pe_micro.php?id=06 "    id="06"  target="_blank">Carte </a> </td>
			<td><a href="cartographie_pharm.php?id=06"    id="06"  target="_blank">Carte </a> </td>
			<td><a href="cartographie_divers.php?id=06"    id="06"  target="_blank">Carte </a> </td>
		</tr>
		    		<tr>
		    <td> 07</td>
			<td><a href="#" class="popup-light" data-popup-class="popup-block" data-popup-width="500px"  id="07">les societes des agents </a> </td>
			<td><a href="cartographie_ge_me.php?id=07"   id="07"  target="_blank">Carte </a> </td>
			<td><a href="cartographie_pe_micro.php?id=07 "    id="07"  target="_blank">Carte </a> </td>
			<td><a href="cartographie_pharm.php?id=07"    id="07"  target="_blank">Carte </a> </td>
			<td><a href="cartographie_divers.php?id=07"    id="07"  target="_blank">Carte </a> </td>
		</tr>
		    		<tr>
		    <td> 08</td>
			<td><a href="#" class="popup-light" data-popup-class="popup-block" data-popup-width="500px"  id="08">les societes des agents </a> </td>
			<td><a href="cartographie_ge_me.php?id=08"   id="08"  target="_blank">Carte </a> </td>
			<td><a href="cartographie_pe_micro.php?id=08 "    id="08"  target="_blank">Carte </a> </td>
			<td><a href="cartographie_pharm.php?id=08"    id="08"  target="_blank">Carte </a> </td>
			<td><a href="cartographie_divers.php?id=08"    id="08"  target="_blank">Carte </a> </td>
		</tr>
 
		 </table>

merci d'avance pour votre aide

**fayred** · 29/08/2013, 14h48

Bonjour,

tu peux pour celà utiliser la partie ajax de jquery : http://api.jquery.com/jQuery.get/

Il faut tout d'abord que tu recuperes la valeur de ton input pour l'envoyer dans requete au serveur. Ensuite ton script php doit renvoyer la ville qui correspond. Tu récupères après, coté javascript, la ville et tu l'insères là où tu veux.

N'hésite pas à poster les différentes parties du code (js et php) pour que l'on puisse t'aider.

Bon courage

**diengkals** · 29/08/2013, 15h39

merci de votre aide j'ai essayer de realiser ce bout code code mais rien ne se passe et moi je ne veux envoyer le formulaire a partir d'un bouton voici mon bout de code

Code javascript :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
$(document).ready(function(){
   var addresse= $("select[name='address'] option:selected").val();
   if(addresse=="address")
   {
   $.ajax({ 
	type: "POST", 
	url: "cartographie_ge_me.php, 
	success:function(data){ 
	    data: { 'address': addresse }
        }				  
  });
  }
});

merci d'avance

**fayred** · 29/08/2013, 17h17

Il manque un guillemet " ici :

Code :

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

url: "cartographie_ge_me.php",

Je pense que l'url est plutot du type "http://localhost/cartographie_ge_me.php"
Concernant ta requete et ses paramètres, il faudrait plutôt passer par du get et lui fournir la valeur que tu as récupéré.

Quelques tests avant d'aller plus loin :
Quelles sont les erreurs dans la console d'erreur de ton navigateur?
Si tu utilises "console.log" ou "alert" pour afficher la valeur récupéré de ton select, est-ce que tu récupère la bonne valeur?
Si tu vas directement sur l'url http://localhost/cartographie_ge_me.php est-ce que tu récupères bien quelque chose?

Si tu n'a jamais utilisé jquery ajax je te conseille d'aller faire un petit tour du coté de la doc et des tutos et de refaire un petit exemple simple.

**Bovino** · 29/08/2013, 17h20

Code :

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

if(addresse=="address")

Tu t'es demandé dans quels cas cette condition est remplie ?

**diengkals** · 29/08/2013, 17h45

merci de votre aide c'est pas la première fois que je travaille avec jquery mais la je rencontre un niveau probleme , j'ai l habitude de faire des insert dans BD avec jquery mais c'est pas la meme chose car labas j utiliser le submit d'un button mais la je doit réagir en fonction de l'option selectionner.

Il manque un guillemet " ici :

bon j ai corrigé les guillemets mais rien ne se passe

if(addresse=="address")

cela teste si ya option est bien selectionner merci de votre voici mon nouveau code

Code javascript :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
$(document).ready(function(){
{
	var addresse= $("select[name='address'] option:selected").val();
	if(addresse=="address")
	{
		$.ajax({ 
			type: "POST", 
			url: "cartographie_ge_me.php", 
			success:function(data){ 
				data: { 'address': addresse }
        }				  
		  });
   }
 
	});

**fayred** · 29/08/2013, 17h57

Il faudrait également que tu écoutes l'evenement sur le select pour savoir quand il a été rempli.

A priori ce qui se passe actuellement (ce ne sont que des suppositions, il faudrait que tu fasses des console.log ou des alert pour vérifier) :

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
 
$(document).ready(function(){ 
	{
	  var addresse= $("select[name='address'] option:selected").val(); //cette variable est assignée au chargement de la page.
// or, tu n'a pas encore selectionné d'option dans ton select donc il ya des chances que ta variable soit vide.
   if(addresse=="address")// la variable est vide (à vérifier), on ne passe pas dans le if
   {
   $.ajax({ 
					type: "POST", // passe en get ce sera plus simple, et il faudra que tu mettes ton parametre dans l'url
					url: "cartographie_ge_me.php", // je pense vraiment que ce n'est pas la bonne url, as tu vérifié (voir mon post précédent) ?
					success:function(data){ // ici fais un console.log pour verifier que tu arrives bien dans la fonction (ou pas !)
					data: { 'address': addresse }
        }				  
		  });
   }
 
	});

Et enfin, as-tu vérifié ce que te renvoyais le script php?

recuperer input select sans sumbit

jQuery

Discussions similaires

Partager

Partager