Problème Insertion Mysql Php Ajax Prototype

Eléphanteau du PHP | 38 Messages

21 mars 2009, 00:11

Bonjour avant toutes choses je tiens à m'excuser des possibles erreurs que je vais effectuer concernant ma requête sur le forum (c'est mon premier post). J'espère que vous ne m'en tiendrez pas rigueur.

Mon problème est le suivant. Je viens de mettre à l'ajax et à prototype.

Je souhaite insérer une ligne dans ma base de données avec prototype par l'intermediaire d'un formulaire que voici:

Code : Tout sélectionner

<form action="artists2.php" method="post" enctype="multipart/form-data"> <table> <tr> <th>Ajouter Artiste </th> <td><input type="textarea" name="art_name" /></td> </tr> <tr> <th></th> <td><input type="submit" value="Valider" /></td> </tr> </table> </form>
Dans le <head> bien sur j'ai

Code : Tout sélectionner

<script type="text/javascript" src="lib/prototype.js"></script> <script type="text/javascript" src="scripts/artists2.js"></script>
A l'insertion de mon artiste un tableau doit se créer dynamiquement pour m'afficher mon insertion avec deux liens images (une image pour modifier, l'autre pour supprimer).

Dans mon html je cree un <div id="artists"> ou le tableau devra être créé.

Voici mon artists2.js

Code : Tout sélectionner

var artist = { response: null, responseArtist: null, // la fonction init doit initialiser, pas lancer de requete aJAX init:function(){ // on recupere le formulaire var theForm = $$("form").first(); // On attache un listener sur l'evenement submit theForm.observe("submit", function(e){ // Comme on bind la fonction sur le formulaire, this est le formulaire var url = 'getArtistAdded.php'; new Ajax.Request(url, { method: 'get', // On serialize le formulaire pour avoir les valeurs saisies parameters : this.serialize(true), onSuccess: function(transport){ artist.responseArtist = transport.responseText.evalJSON(); if (artist.responseArtist.artist[0] !=false){ artist.writeArtistTable(artist.responseArtists.artist); } else { $('artist').innerHTML = "Veuillez entrer un artiste"; } } }); }.bindAsEventListener(theForm)); }, writeArtistTable : function(response){ var table = new Element('table', {'id': 'tbArtist'}); var tr0 = new Element('tr'); var th0 = new Element('th').update("ID"); var th1 = new Element('th').update("Artiste"); var th2 = new Element('th', {'colspan', '2'}).update("Action"); tr0.insert(th0); tr0.insert(th1); tr0.insert(th2); table.insert(tr0); response.each(function(elt){ var tr1 = new Element('tr'); var td1 = new Element('td').update(elt.art_id); var td2 = new Element('td').update(elt.art_name); var td3 = new Element('td'); var imgModif = new Element('img', {'src': 'modifier.png', 'alt': 'modifier', 'title': 'modifier', href: 'artist2.php?modif=elt.art_id'}); td3.insert(imgModif); var td4 = new Element('td'); var imgSuppr = new Element('img', {'src': 'supprimer.png', 'alt': 'supprimer', 'title': 'supprimer', href: 'artist2.php?suppr=elt.art_id'}); td4.insert(imgSuppr); tr1.insert(td1); tr1.insert(td2); tr1.insert(td3); tr1.insert(td4); table.insert(tr1); }); $('artist').appendChild(table); } }; Event.observe(window, 'load', artist.init);
Pour finir mon php pour inserer l'artiste (getArtistAdded.php)
<?php include_once("connexion.php"); ?>
<?php
mysql_select_db($database, $base);
 
function remplaceBR($chaine)
{
    $chaine = str_replace("\r\n","<br>",$chaine);
    $chaine = str_replace("\n","<br>",$chaine);
    return $chaine;
}
 
if(isset($_POST['art_name'])){
$name = strip_tags($_POST['art_name']);
// Premiere insertion sans l'id 
	$texte = remplaceBR($texte);
	$query01="INSERT INTO  artists(art_id, art_name) VALUES ('NULL', '$name')";
	$result01=mysql_query($query01);  
	$id=mysql_insert_id();
	
// On recupere l'id de l'artiste pour l'afficher
	$query_artist = sprintf("SELECT * FROM artists WHERE art_id = $id");
	$artist = mysql_query($query_artist, $base) or die(mysql_error());
	$row_artist = mysql_fetch_assoc($artist);
	$result = array();
}
?>
 
<?php
do {  
$result[] = $row_artist;
} while ($row_artist = mysql_fetch_object($artist));
echo '{"artist":'.json_encode($result).'}';
?>
Le problème vient forcemment d'artists.js car quand je mets le lien du php pour inserer getArtistAdded.php dans l'action du formulaire l'insertion se passe sans problème.

Je n'ai aucun message d'erreur à l'ecran, il ne passe rien quand j'execute le script.

Je vous remercie d'avance pour votre aide et surtout votre compréhension ajax et prototype sont tout nouveau pour moi.
Nats

Eléphant du PHP | 141 Messages

23 mars 2009, 07:32

As tu regarder avec Firebug ?
Cette extension permet de voir toutes les requêtes faites sur une page. C'est pas mal car tu peux voir la réponse récupérer par ajax, et avoir plus d'info sur l'erreur.

Eléphanteau du PHP | 38 Messages

23 mars 2009, 09:54

J'ai regardé dans firebug et il ne s'y passe rien
Nats

Eléphant du PHP | 141 Messages

23 mars 2009, 15:20

Comment ça ?
Dans l'onglet Réseaux, tu actives la surveillance du réseau (s'il te demande) et tu regarde la liste des requêtes.

Eléphanteau du PHP | 38 Messages

02 avr. 2009, 23:00

Désolé j'ai mis énormément de temps à répondre mais j'ai eu un problème de serveur.
Au niveau de la console d'erreur de firefox voici le message d'erreur que j'ai

Erreur : Permission refusée d'appeler la méthode Location.toString

au niveau des onglets je n'ai que:
Tout
Erreurs
Avertissements
Message
Effacer
Nats

Invité
Invité n'ayant pas de compte PHPfrance

02 avr. 2009, 23:20

sans garantie essaie de mettre des urls absolues :
pour les fichiers js et pour var url = 'getArtistAdded.php';

redis nous ca apres :D

Mammouth du PHP | 661 Messages

02 avr. 2009, 23:36

aurais tu un lien vers la page pour faire des tests en live ?

Eléphanteau du PHP | 38 Messages

03 avr. 2009, 20:10

sans garantie essaie de mettre des urls absolues :
pour les fichiers js et pour var url = 'getArtistAdded.php';

redis nous ca apres :D
j'ai mis les url absolues ça n'a rien changé, il ne se passe rien

voilà le lien

http://morethanmusicradio.com/admin_radio/artists2.php
Nats

Eléphanteau du PHP | 38 Messages

30 juin 2009, 10:09

Bonjour à tous,
Je suis de retour avec un script presque fini. J'ai toujours deux trois bugs mais je pense bien m'en sortir avec votre aide

Pour rappel avec prototype et ajax à l'aide d'un formulaire j'insère un artiste.
A l'insertion je l'affiche dans un tableau sous mon formulaire initial. Tout se passe très bien sauf que le page ne se rafraichit pas et que mon script ne fonctionne pas sous Ie.

Le texte tapé dans le champ texte reste présent et il suffit d'appuyer sur valider pour que l'insertion se fasse. Comme la page ne se rafraichit pas les insertions s'affichent les unes en dessous des autres.

Mes liens dans le tableau crées dynamiquement ne fonctionnent pas

Code : Tout sélectionner

var imgModif = new Element('img', {'src': 'modifier.png', 'alt': 'modifier', 'title': 'modifier', href: '/art_nat.php?modif=elt.art_id'});
Sous Ie j'appuie sur Valider et il ne passe rien.

Voici mes scripts.

Mon formulaire


Code : Tout sélectionner

<?include "_debut.php";?> <script type="text/javascript" src="lib/prototype.js"></script> <script type="text/javascript" src="scripts/art_nat.js"></script> <div id="Content"> <h1>Artistes</h1> <div class="block"> <form method="post" action="newArtist.php" name="monForm" id="monForm" enctype="multipart/form-data"> <table> <tr> <th>Ajouter Artiste </th> <td><input type="textarea" name="art_name" /></td> </tr> <tr> <th></th> <td><input type="submit" value="Valider" id="go" /></td> </tr> </table> </form> </div> <br /> <div class="block"> <div id="arts"></div> </div> </div> <?include "_fin.php";?>
Mon script d'insertion

Code : Tout sélectionner

<?php include_once("connexion.php"); ?> <?php mysql_select_db($database, $base); if(!empty($_POST['art_name'])){ $query_artist = sprintf("INSERT INTO artists(art_name) VALUES('%s');", $_POST['art_name']); $artist= mysql_query($query_artist, $base); if($artist == true){ $id=mysql_insert_id(); $query_artist = sprintf("SELECT * FROM artists WHERE art_id = $id"); $artist = mysql_query($query_artist, $base) or die(mysql_error()); $row_artist = mysql_fetch_assoc($artist); $result = array(); do { $result[] = $row_artist; } while ($row_artist = mysql_fetch_object($artist)); echo '{"arts":'.json_encode($result).'}'; } } else{ echo json_encode("Une erreur s'est produite lors de l'enregistrement de l'artiste."); } ?>
Mon javascript pour finir

Code : Tout sélectionner

var artists = { justAdded : null, init : function(){ if($('monForm') && $('go')){ Event.observe( $('go'), 'click', function(evt){ Event.stop(evt); var url = $('monForm').action; new Ajax.Request(url, { method: 'post', parameters : $('monForm').serialize(true), onSuccess: function(transport){ artists.justAdded = transport.responseText.evalJSON(); if(!Object.isString(artists.justAdded)){ artists.writeArtistsTable(artists.justAdded.arts); } else if(Object.isString(artists.justAdded)){ $('arts').innerHTML = artists.justAdded; } } }); } ); } }, writeArtistsTable : function(justAdded){ var table = new Element('table'); var tr0 = new Element('tr'); var th0 = new Element('th').update("ID"); var th1 = new Element('th').update("Artiste"); var th2 = new Element('th', {'colspan': '2'}).update("Action"); tr0.insert(th0); tr0.insert(th1); tr0.insert(th2); table.insert(tr0); justAdded.each(function(elt){ var tr1 = new Element('tr'); var td1 = new Element('td').update(elt.art_id); var td2 = new Element('td').update(elt.art_name); var td3 = new Element('td'); var imgModif = new Element('img', {'src': 'modifier.png', 'alt': 'modifier', 'title': 'modifier', href: '/art_nat.php?modif=elt.art_id'}); td3.insert(imgModif); var td4 = new Element('td'); var imgSuppr = new Element('img', {'src': 'supprimer.png', 'alt': 'supprimer', 'title': 'supprimer', href: '/art_nat.php?suppr=elt.art_id'}); td4.insert(imgSuppr); tr1.insert(td1); tr1.insert(td2); tr1.insert(td3); tr1.insert(td4); table.insert(tr1); }); $('arts').appendChild(table); } } document.observe('dom:loaded', artists.init);
Merci d'avance
Nats