Discussion :

[gtraxx]

Bonjour à tous, je travail actuellement avec autocomplete de jquery UI
Je récupère les communes pour un champs texte, mais je souhaite une fois choisi la commune, avoir le champs texte du code postal qui se rempli sur base de ce choix.
Dans la base de donnée, la commune est enregistré avec son code postal, donc ma question comment m'y prendre.

Code :

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

1
2
3
 
var autocomOpts = {url: "communes.php",scrollHeight: 220};
$("#commune").autocomplete(autocomOpts);

Le code html du code postal et commune :

Code :

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

1
2
3
4
5
6
<p><label for="commune" class="inlinelabel">Commune :</label>
		<input type="text" id="commune" name="idcommune" value="" size="40" />
	</p>
	<p><label for="codepostal" class="inlinelabel">Code postal :</label>
		<input type="text" id="codepostal" name="codepostal" value="" size="5" />
	</p>

Il faut juste que je trouve la parade, étant donnée que je récupère la commune avec une requête plutôt simple.

Code :

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

$sql='SELECT commune FROM communes WHERE commune LIKE "'.$this->q.'%"';

L'autocomplete fonctionne à merveille

EDIT : je viens de comprendre un truc pourquoi ne pas faire une requête en cliquant sur une checkbox ...
Donc j'ai fais ceci :

Code :

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

1
2
3
4
5
6
7
8
9
$(':checkbox#addcommune').click(function(){
 		if(this.checked){
		 	$("#commune").change(function(){
		    	$.get("/communes.php?commune="+ $(this).val(),function(j){
		     		$("#idcommune").val(j);
		    	})
		  	})
 		}else{$("#idcommune").val();}
 	});

le HTML :

Code :

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

1
2
3
4
5
6
7
<p><label for="commune" class="inlinelabel">Commune :</label>
		<input type="text" id="commune" name="commune" value="" size="40" />
	</p>
	<p><label for="addcommune">Ajouter code postal :</label>
		<input type="checkbox" name="addcommune" id="addcommune" value="" />Code postal
		<input type="text" id="idcommune" name="idcommune" value="" size="40" />
	</p>

Seulement il ne lance pas la requête, en plus je dois remplir deux champs mais bon si le premier passe le deuxième suivra
Pourquoi le get ne se lance pas au click ?

[gtraxx]

Pour faire propre et que tout le monde comprennent.
j'ai trouver une astuce très intéressante pour faire ce que je voulais.

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
$(':checkbox#addcommune').click(function(){
 		if(this.checked){
		    $.getJSON("/communes.php?commune="+ $("#commune").val(),
		    function(j){
		    	  $("#codepostal").removeAttr("disabled","disabled");
			      $('#idcommune').val(j.idcommunes);
			      $('#codepostal').val(j.codepostal);
		    });
 		}else{
 			$("#codepostal").attr("disabled","disabled");
 			$('#idcommune').val('');
			$('#codepostal').val('');
 		}
 	});

Une requête Json semblais très approprié dans ce cas-ci.

Le html :

Code :

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

1
2
3
4
5
6
7
8
<p><label for="commune" class="inlinelabel">Commune :</label>
		<input type="text" id="commune" name="commune" value="" size="40" />
	</p>
	<p><label for="addcommune">Ajouter code postal :</label>
		<input type="checkbox" name="addcommune" id="addcommune" value="" />Code postal
		<input type="hidden" id="idcommune" name="idcommune" value="" />
		<input type="text" id="codepostal" name="codepostal" value="" size="5" />
	</p>

Une requête très simple :

Code :

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

'SELECT idcommunes,codepostal FROM communes WHERE commune = '.$this->commune

Et pour notre tableau :

Code :

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

foreach(Communes() as $key) print '{idcommunes: "'.$key["idcommunes"].'", codepostal: "'.$key['codepostal'].'"}';

Je pense en faire un tutoriel, fallais juste comprendre comment faire.
Un jeu d'enfant