select liés et retour ajax
Bonjour,
Je cherche a essayer de lier deux select entre eux.
Au changement du premier select, le second doit se mettre à jour.
Les traitements qui diront quoi afficher dans le second select seront dans un fichier ajax.php qui sera appelé sur la page ou se trouve mes select.
J'ai essayé ceci :
fichier ajax.php
Code:
1 2 3 4
|
<?php
echo "<option>test</option>";
?> |
Fichier principal :
Code:
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
|
<html>
<head>
<title>Essai : lier des select</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script>
$(document).ready( function()
{
$('#select_auteur').change( function()
{
var donnee= "";
$('#select_auteur option:selected').each(function () {
donnee += $(this).val();
});
$.ajax({
type: "POST",
url: "ajax.php",
data: "select_auteur="+encodeURIComponent($("#select_auteur").val()),
datatype : "html",
success: function(msg){
alert(msg);
$("#select_livre").html(msg);
}
});
})
})
</script>
</head>
<body>
<form name="formulaire">
<fieldset style="width: 500px">
<legend>Liste liées</legend>
<label>Auteurs</label>
<select id='select_auteur'>
<option value='1'>choix 1</option>
<option value='2'>choix 2</option>
<option value='3'>choix 3</option>
</select>
<label>Livres</label>
<div>
<select id="select_livre"></select>
<div>
</fieldset>
</form>
</body>
</html> |
Le premier problème, c'est que je n'arrive pas à récupérer ce qu'affiche le fichier ajax.php
dans cet exemple, le alert ne m'affiche même pas "<option>test</option>"
Mon second problème est que je ne suis pas sur d'utiliser la bonne méthode. J'ai choisi ici le type:post. Du coup, si je veux récupérer le choix du premier select dans mon fichier ajax.php, est ce que $_POST["select_auteur"] me permettra de récupérer la valeur ?
merci