[ajax et php] mes premiers essais!

Logiciel & apps Programmation
1

bonsoir,

je suis entrain d’essayer d’utiliser ajax dans un code php et j ai un petit problème:

voici une partie de mon formulaire:


<tr><td>Modèle:</td><td><input name="ref_<?php echo $i;?>" type="text" onclick="window.open('choix_article.php?param=ref_<?php echo $i;?>','Choisir','width=500,height=250');" value="" onChange="verifprixachat(this.value)"></td>
<td>Prix achat:</td><td><input name="prix_achat" type="text" maxlength="10" size="5" value=""></td>

voici le script javascript appelé:


<script type="text/javascript">
function writediv(texte)
  {
  document.getElementById('prix_achat').innerHTML = texte;
  }

function verifprixachat(designation)
{
texte = file('verifprix_achat.php?designation='+escape(designation)))
writediv(texte);
}

et le code php :


<?php
//
// VERIFICATION prix achat
//

// CONNECION SQL
include '../connexion.php';

// VERIFICATION
$result = mysql_query("SELECT Prix_achat FROM articles WHERE designation='".$_GET["designation"]."'");
if(mysql_num_rows($result)>=1)
while($data_recherche_devis = mysql_fetch_array($result))   
  {
  echo $prix_achat=$data_recherche_devis['Prix_achat'];
  }
?>

mon formulaire de base est un peu compliqué:
en effet lorsqu on clique sur input, ca va chercer une page pour faciliter la recherce des articles. on selectionne celui voulu et la ca le met directement dans le input.
la, le Onchange devrait se mettre en action et aller voir le prix d’achat dans la base de données et le mettre dans le champ “prix_achat”…

ca ne marche pas du tout…

De plus, ce formulaire est dans une boucle for…car j ai un certain nombre de champs répété, ajax peut gérer ca? (le premier article dans prix_achat_0, le deuxième dans prix_achat_1…)

merci d’avance pour votre aide

2

ps: AJAX = Asynchronous Javascript and XML.

Le côté XML c’est pas de générer du code HTML à la porc, et le foutre comme un barbare dans la page avec innerHTML.

L’un des points clef d’AJAX c’est de commencer par faire une page XHTML+CSS valide, que tout fonctionne sans AJAX, et d’ajouter AJAX comme truc additionnel.

Essaye :

document.getElementById(‘prix_achat’).value = texte;

input est un élément vide (cf. doc XHTML, HTML, …) qui ne contient rien, donc innerHTML ça risque pas de fonctionner.

3

desole,…j avoue que j ai trouve ce code sur internet et que je l ai modifié selon mes besoins…

document.getElementById(‘prix_achat’).value = texte;; ca ne marche pas non plus

4

l’XHTML, c’est du XML et il n’y a aucun mal à récupérer du XHTML et à l’insérer via un innerHTML. C’est même souvent préférable vu la vitesse de traitement javascript, faire plein de joli Nodes XML et les convertir après en JS, quand ça sert à rien, c’est vraiment pour se la péter “Moi je fais tout en XML”.

5

XML c’est vrai que c’est lourd à travailler en JS mais JSON nettement moins

6

Même le JSON reste un traitement client qui peut s’avérer assez lourd.

Au départ, je préférais faire les choses en XML, juste pour pouvoir dire “C’est bien, je fais de l’XML”, et après un peu d’expérience en Ajax, je me suis rendu compte que finalement ça ne servait à rien à part occuper du CPU client voir le bloquer (si si, sur des grosses listes, j’ai eu le cas). Donc, qu’on préfère faire de l’XML, ok, mais quand dans 98% des cas, le résultat est exactement similaire à générer du XHTML sur le serveur (qui n’est pas pénalisé lui puisque qu’il fait globalement la même chose) et à faire ensuite un innerHTML, j’estime que rien ne le justifie à part “Pour dire que”.
Et je ne parle même pas des incompatibilités navigateurs qui n’existent pas avec un innerHTML.

7

meilleurs voeux pour cette année 2007!

8

Certainement que c’est plus lent (je ne le nie pas). Mais innerHTML n’est pas un standard ni une recommandation, juste un truc inventé par IE, tout comme AJAX tu me diras.

Et innerHTML dit ce qu’il dit : innerHTML.

Si. Fx + entête application/xhtml+xml (la vraie entête du xhtml, pas text/html) n’acceptait pas qu’on modifiait un noeud XML via innerHTML : c’était une propriété en lecture seule.

Alors que appendChild() et toutes ces conneries fonctionnent complètement sous IE, Fx, Opera…

Le seul souci réside dans IE et l’attribut style/class qu’il faut définir via className, et style.cssText … braiffe

9

Ouaip, mais ça marche bien partout, donc bon…

http://www.quirksmode.org/dom/innerhtml.html
Qui plus est, la différence de perfs est loin d’être anodine. Même si ça concerne surtout IE, ça reste le navigateur le plus utilisé de la planète.
Ca marche mieux, c’est plus simple, c’est plus rapide, y’a vraiment aucune raison à mes yeux de l’imposer.
Bref, encore une bonne idée MS que le W3C n’a pas cru bon de récupérer. MS, c’est le mal. Heureusement, notre liberté nous permet d’être plus intelligent qu’eux. :o

10

Ce n’est pas vrai comme je te l’ai dis :slight_smile:

95% (voire plus) des serveurs faisant du XHTML le font mal. Le xhtml doit être envoyé avec l’entête application/xhtml+xml, ce qui sous IE se résout par “télécharger le fichier”.

Et si les serveurs le faisait, ça pourrait poser problème sous Fx1.0 (où innerHTML est en lecture seule, etc) voire Fx1.5, ou d’autres browser moins utilisés.

Au niveau DOM, je crois que le plus rapide reste Opera. Fx est bien, mais lent.

Et sinon, sous IE, je crois que tu confond innerHTML avec un truc faisant du XML… loin de ça, je doute que ça fasse du XML [ceci dit, tu ne sais pas, ni moi, comme fonctionne le moteur d’IE] :slight_smile: surtout vu le nom de la méthode :slight_smile:

Je pense personnellement que sous Fx & Opera, ça se résout par faire du DOM au final : il parse le code HTML façon Quirks, et l’ajoute au noeud DOM.

Braiffe.

innerHTML c’est beau, mais pour moi ça reste crade :slight_smile:

11

Pour moi, ça reste la meilleure méthode, la plus compatible et la plus rapide.
Et surtout, sur certaines grosses requêtes, c’est la seule qui fonctionne sans qu’on ait le temps d’aller boire un café. Si c’est pour afficher un truc bateau, c’est la solution idéale.

12

Le résultat avec DOM est détonnant sous IE d’ailleurs :slight_smile:

13

et qq1 a une idée pour mon problème?

14

Il te dit un truc? Tu accèdes à une ressource locale? externe (= pas possible) ?

Et avec un alert(texte) voir ce que le fichier XML contient? etc.

15

c bien ca le problème: il me dit RIEN

et quand je dis rien c est rien

je ne sais pas ce qu il faut chercher

je vais essayer avec un alert
merci

16

Bon.

Ouvre le flux que tu tentes d’ouvrir directement dans le navigateur : cela permet de voir ce que tu reçois vraiment, voir s’il y a une erreur, etc

Sinon installe Firebug :slight_smile: c’est une assez bonne extension Fx qui permet entre autres de catcher les requêtes XmlHttp (AJAX pour les nuls)

17

j ai installé firebug, maintenant il m affiche qd je vais sur la page :

function writediv(texte) { document.getElementById(‘prix_achat’).value = texte; } function verifprixachat(designation) { texte = file(‘verifprix_achat.php?designation=’+escape(designation))) writediv(texte); }

et c est tout

heu,comment tu fais ca?

18

bon finalement jai pas trop mal avancé:

a force je me suis dit que c etait pas normal qu il m affiche le code en texte ainsi

je l ai deplacé pareil…et puis tt d un coup j ai vu que j avais oublié de mettre le </script> a la fin du javascript

ca c est bon ca marche, j ai plus l’affichage en texte de mon script javascript

après (enfin) il m a detecté plusieurs erreurs que je suis entrain de corriger, mais je bloque sur une:

“file is not defined” pour lal igne:
texte = file(‘verifprix_achat.php?designation=’+designation);

je ne comprends pas trop, le fichier existe bien, et j ai verifié par un alert, le contenu de designation est bien bon

De plus j ai une autre petite question:

comment peut on faire pour gérer les for?
en effet le code en partie corrigé c est ca:
partie java script:


<script type="text/javascript">
function writediv(texte)
	{
	document.getElementById('prix_achat').value = texte;
	}

function verifprixachat(designation)
	{
	alert(designation);
	texte = file('verifprix_achat.php?designation='+designation);
	writediv(texte);
	}	
</script>

partie html:


  <tr><td>Modèle:</td><td><input name="ref_<?php echo $i;?>" type="text" onclick="window.open('choix_article.php?param=ref_<?php echo $i;?>','Choisir','width=500,height=250');" value="<?php echo $modele[$i];?>" ></td>
  <td>Prix achat:</td><td><input name="prix_achat" type="text" maxlength="10" size="5" value="" onClick="verifprixachat(ref_0.value)"></td>

Comme vous pouvez le constater, j ai modifier le script du formulaire, en effet le onChange que j appliquais a l’input ref ne fonctionnait clairement pas
je l ai déplacé sur le champ prix_achat par un onClick.

mais ref evolue en ref_0,ref_1 etc etc, et normalement prix_achat ca sera pareil puisqu il evoluera de la meme facon que ref en prix_achat_0 avec ref_0, prix_achat_1 avec ref_1 etc etc.

comment peut on gérer ca avec le javascript, pour que le champ ou il recupère la désignation soit le bon, et la destination ou il met le prix achat soit le bon aussi?

merci

19

Ouvrir le flux ça veut dire l’ouvrir dans ton navigateur plutôt que par AJAX :slight_smile:

20

si j ai bien compris, c est en fait ce que j ai fait.

j ai essaye le tout mais de facon indépendante (et c est d’ailleurs ainsi que j ai vu que le onchange ne machait pas)