Bonjour,
Je tente de réaliser mon premier select alimenté via ma base de données mysql et ajax avec jquery.
Après m'être documenté j'ai pensé que je pouvais faire cela avec la fonction $.getJson.
Le problème c'est qu'il ne se passe rien au niveau de mon select, j'ai strictement rien même pas une erreur au niveau de firebug.
Je souhaite que les options de mon select aient pour value l'id (art_id) de l'artiste et le text des options le nom de l'artiste (art_name) que je récupère dans ma base de données.
Mon script php me permettant de récupérer les artistes fonctionne bien je vois bien tous les artistes de base de données dans firebug.
Je pense que le problème se situe au niveau de mon js que voici
Pour finir mon HTML
Je vous remercie d'avance pour votre aide et votre compréhension.
Je tente de réaliser mon premier select alimenté via ma base de données mysql et ajax avec jquery.
Après m'être documenté j'ai pensé que je pouvais faire cela avec la fonction $.getJson.
Le problème c'est qu'il ne se passe rien au niveau de mon select, j'ai strictement rien même pas une erreur au niveau de firebug.
Je souhaite que les options de mon select aient pour value l'id (art_id) de l'artiste et le text des options le nom de l'artiste (art_name) que je récupère dans ma base de données.
Mon script php me permettant de récupérer les artistes fonctionne bien je vois bien tous les artistes de base de données dans firebug.
<?php include_once("connexion.php"); ?>
<?php
mysql_select_db($database, $base);
$query_artists = "SELECT * FROM artists ORDER BY art_name ASC";
$artists = mysql_query($query_artists, $base) or die(mysql_error());
$row_artists = mysql_fetch_assoc($artists);
$result = array();
?>
<?php
do {
$result[] = $row_artists;
} while ($row_artists = mysql_fetch_object($artists));
echo '{"artists":'.json_encode($result).'}';
?>
Je pense que le problème se situe au niveau de mon js que voici
function populateArtistSelect(){
$.getJSON("getArtists.php", function(data){
var select = $("#artists");
var option = $("<option/>");
var optionClone = null;
$.each(data, function(index, array) {
optionClone = option.clone(true);
optionClone.val(array.art_id);
optionClone.text(array.art_name);
select.append(optionClone);
});
});
}
$(document).ready(function(){
populateArtistSelect();
});
Pour finir mon HTML
<form id="formSingles" action="newSinglesTest.php" method="post">
<table>
<tr>
<th>Selectionnez Votre Artiste:</th>
<td><select name="artists" id="artists"></select></td>
</tr>
<tr>
<th>Entrez Votre Single:</th>
<td><input type="text" name="single" value="" /></td>
</tr>
<tr>
<th>Pochette Single</th>
<td><input type="file" name="single_cover" size="50" /></td>
</tr>
<tr>
<th>Année de Sortie</th>
<td><input type="text" name="single_release_date" /></td>
</tr>
<tr>
<th></th>
<td><input class="submitButton" type="submit" value="Valider" /></td>
</tr>
</table>
</form>
Je vous remercie d'avance pour votre aide et votre compréhension.