Ajax et JavascriptRésolu

Question

Bonjour à tous, je débute en Ajax, et je souhaiterais savoir une chose : Est-ce que l'on peu "importer" du nouveau code JavaScript via une "requête" Ajax ? Je m'explique : Je fais lance une "requête" Ajax avec : ... xhr.open("POST","ajax_dispatcher.php",true); ... et je recupère la réponse avec : ... reponse = xhr.responseText; ... je mets la réponse dans une div avec : ....innerHTML = reponse; Ma page ajax_dispatcher.php pourrait être : Ya du code HTML ! En ouvrant cette page directement avec une navigateur, on a une petite fenêtre avec écrit "Ya du code JavaScript !" dedans, et sur la page, on voit le texte "Ya du code HTML !" En utilisant Ajax pour récuperer la page et la mettre dans une div, "Ya du code HTML !" arrive, mais ya pas ma fenêtre avec Javascript "Ya du code JavaScript !". Est-ce normal ? Comment faire pour que la JavaScript passe ? Merci d'avance

cs_bultez · Accepted Answer

Bonjour,

    on en a déjà causé, et on en cause ici.

    la question fondamentale : pourquoi faire ?
        généralement c'est totalement inutile !
    mettre le javascript, bêtement, dans la page...

<hr />                Cordialement             Bul         [mon Site]     [M'écrire]

en général c'est stupide de généraliser.

cs_bultez · Answer

parce que, pour ton exemple :
    
         .....
        je mets la réponse dans une div avec 
            ....innerHTML = reponse;
              alert("Ya du code JavaScript !");         
    
    ça baigne....

    je sais bien que ce n'est pas un alert dont tu as besoin !

<hr />                Cordialement             Bul         [mon Site]     [M'écrire]

dmk04 · Answer

Je n'avais pas vu que le sujet était déjà traité, et à vrai dire je n'avais pas fait de recherche, vu que je ne savais pas quels mots clés utiliser pour ma recherche, il doit y avoir foule de messages qui parle de "Ajax" et "JavaScript". Pour le "pourquoi faire ?" : En fait, je développe une application web de reporting actuellement, et il y a pas mal de tableaux à afficher, et j'ai donc crée une classe Tableau qui me permettra de gérer tous mes tableaux (double tri, traitement des données avant affichage, lien vers une page ou fonction JS...). Voici le squelette que j'utilise pour gérer une colonne :

$this->numCol $i;
$this->colonnes[$i]['field'] "CHAMP"; // nom du champ dans la requete
$this->colonnes[$i]['name'] = "Titre col"; // nom de la colonne
$this->colonnes[$i]['width'] = "10%"; // largeur de la colonne
$this->colonnes[$i]['align'] = "left"; // alignement des donnees
$this->colonnes[$i]['func'] = ""; // fonction a appeler pour traiter les donnees
$this->colonnes[$i]['pref'] = ""; // prefixe
$this->colonnes[$i]['suff'] = ""; // suffixe
$this->colonnes[$i]['link']['dest'] = "javascript:fonctionJavaScript"; // lien
$this->colonnes[$i]['link']['params'][0] = $this->numCol;// numero de la colonne (du tableau $this->colonnes) contenant la valeur du parametre
$this->colonnes[$i]['tri'] = $triDefaut; // OUI si on peu trier sur cette colonne, sinon NON
$this->colonnes[$i]['prim'] = OUI; // colonne de tri primaire OUI/NON
$this->colonnes[$i]['sec'] = NON; // colonne de trisecondaire OUI/NON
$this->colonnes[$i]['ordre'] = $ordreDefaut; // ordre du tri ASC/DESC

Ma classe Tableau mouline un tableau contenant des informations sur les colonnes, avec un autre tableau contenant les données. Dans ma page principale, j'ai plusieurs div, et chacune d'entre elle est géré par une classe qui a un tableau pour définir les colonnes. Chaque classe a également ces fonctions JavaScript que je souhaite "écrire" en même temps que le tableau... Je ne sais pas si je suis bien clair, voici ma classe "DetailCommandes" pour exemple (elle n'est pas finie, et il y a quelques erreurs, mais c'est pour montrer l'idée) :

require_once("oracle.class.php");
require_once("tableau.class.php");
require_once("requetes_oracle.inc.php");
require_once("gestion_erreurs.inc.php");
require_once("graphique.class.php");
/**
* Classe DetailCommandes.
* Gere la zone (calque) contenant les commandes pour une contremarque et un code BocDrive.
*
* @author MPY
* @version 1.0
* @package include
*/
class DetailCommandes
{
/** @var contremarque. */
private $contremarque;
/** @var code BocDrive a analyser. */
private $bocdrive;
/** @var identifiant du calque (balise div) contenant le detail des commandes. */
private $div;
/** @var societe a laquelle la contremarque est rattachee. */
private $societe;
/** @var site auquel la contremarque est rattachee. */
private $site;
/** @var tableau contenant la mise en forme du tableau a afficher. */
private $colonnes;
/**
* Constructeur.
*
* @param array $params 'contremarque' : contremarque.
* 'bocdrive' : code BocDrive.
* 'div' : identifiant du calque (balise div) sur la page web.
*/
public function __construct($params)
{
if(!@isset($params['contremarque']) || !@isset($params['contremarque']))
{
ERREUR();
exit;
}
$this->contremarque = $params['contremarque'];
$this->bocdrive = $params['bocdrive'];
$this->div = $params['div'];
$this->societe = $_SESSION['Societe'];
$this->site = $_SESSION['Site'];
$triDefaut = OUI;
$ordreDefaut = ASC;
$i=0;
$this->numColDateCom = $i;
$this->colonnes[$i]['field'] = "D_DATECOM"; // nom du champ dans la requete
$this->colonnes[$i]['name'] = "Date Com"; // nom de la colonne
$this->colonnes[$i]['width'] = "10%"; // largeur de la colonne
$this->colonnes[$i]['align'] = "left"; // alignement des donnees
$this->colonnes[$i]['func'] = ""; // fonction a appeler pour traiter les donnees
$this->colonnes[$i]['pref'] = ""; // prefixe
$this->colonnes[$i]['suff'] = ""; // suffixe
$this->colonnes[$i]['link']['dest'] = ""; // lien
$this->colonnes[$i]['tri'] = $triDefaut; // OUI si on peu trier sur cette colonne, sinon NON
$this->colonnes[$i]['prim'] = NON; // colonne de tri primaire OUI/NON
$this->colonnes[$i]['sec'] = NON; // colonne de trisecondaire OUI/NON
$this->colonnes[$i]['ordre'] = DESC; // ordre du tri ASC/DESC
$i++;
$this->numColNumCom = $i;
$this->colonnes[$i]['field'] = "C_NUMCOM";
$this->colonnes[$i]['name'] = "Num Com";
$this->colonnes[$i]['width'] = "15%";
$this->colonnes[$i]['align'] = "left";
$this->colonnes[$i]['func'] = "";
$this->colonnes[$i]['pref'] = "";
$this->colonnes[$i]['suff'] = "";
$this->colonnes[$i]['link']['dest'] = "javascript:afficherPostesCommande";
$this->colonnes[$i]['link']['params'][0] = $this->numColNumCom;
$this->colonnes[$i]['tri'] = $triDefaut;
$this->colonnes[$i]['prim'] = NON;
$this->colonnes[$i]['sec'] = NON;
$this->colonnes[$i]['ordre'] = DESC;
$i++;
$this->numColFournisseur = $i;
$this->colonnes[$i]['field'] = "C_FOUR";
$this->colonnes[$i]['name'] = "Fournisseur";
$this->colonnes[$i]['width'] = "25%";
$this->colonnes[$i]['align'] = "left";
$this->colonnes[$i]['func'] = "";
$this->colonnes[$i]['pref'] = "";
$this->colonnes[$i]['suff'] = "";
$this->colonnes[$i]['link']['dest'] = "";
$this->colonnes[$i]['tri'] = $triDefaut;
$this->colonnes[$i]['prim'] = NON;
$this->colonnes[$i]['sec'] = NON;
$this->colonnes[$i]['ordre'] = $ordreDefaut;
$i++;
$this->numColMontantCommande = $i;
$this->colonnes[$i]['field'] = "N_MONTCOM_EUR";
$this->colonnes[$i]['name'] = "Montant Com (€)";
$this->colonnes[$i]['width'] = "25%";
$this->colonnes[$i]['align'] = "right";
$this->colonnes[$i]['func'] = "";
$this->colonnes[$i]['pref'] = "";
$this->colonnes[$i]['suff'] = "";
$this->colonnes[$i]['link']['dest'] = "javascript:afficherPostesCommande";
$this->colonnes[$i]['link']['params'][0] = $this->numColNumCom;
$this->colonnes[$i]['tri'] = $triDefaut;
$this->colonnes[$i]['prim'] = NON;
$this->colonnes[$i]['sec'] = NON;
$this->colonnes[$i]['ordre'] = $ordreDefaut;
$i++;
$this->numColMontantReceptions = $i;
$this->colonnes[$i]['field'] = "N_MONTREC_EUR";
$this->colonnes[$i]['name'] = "Montant Receps (€)";
$this->colonnes[$i]['width'] = "25%";
$this->colonnes[$i]['align'] = "right";
$this->colonnes[$i]['func'] = "";
$this->colonnes[$i]['pref'] = "";
$this->colonnes[$i]['suff'] = "";
$this->colonnes[$i]['link']['dest'] = "javascript:afficherReceptionsPourCommande";
$this->colonnes[$i]['link']['params'][0] = $this->numColNumCom;
$this->colonnes[$i]['tri'] = NON;
$this->colonnes[$i]['prim'] = NON;
$this->colonnes[$i]['sec'] = NON;
$this->colonnes[$i]['ordre'] = $ordreDefaut;
}
/**
* Affiche le detail des commandes pour un code BocDrive et une contremarque.
*
* @param array $params 'prim' : numero de la colonne de tri primaire.
* 'ordreprim' : ordre de tri du tri primaire.
* 'sec' : numero de la colonne de tri secondaire.
* 'ordresec' : ordre de tri du tri secondaire.
*/
public function affiche($params=NULL)
{
$triprim = "";
$trisec = "";
if(@isset($params['prim']))
{// reinitialisation des tris primaires et secondaire pour pouvoir changer le tri
for($i=0; @isset($this->colonnes[$i]); $i++)
$this->colonnes[$i]['prim'] = NON;
if(isset($params['sec']))
for($i=0; @isset($this->colonnes[$i]); $i++)
$this->colonnes[$i]['prim'] = NON;
}
else
{// si les tris ne sont pas defini, on prend ceux par defaut
for($i=0; @isset($this->colonnes[$i]); $i++)
{
if($this->colonnes[$i]['prim'] == OUI)
{
$params['prim'] = $i;
$params['ordreprim'] = $this->colonnes[$i]['ordre'];
}
if($this->colonnes[$i]['sec'] == OUI)
{
$params['prim'] = $i;
$params['ordreprim'] = $this->colonnes[$i]['ordre'];
}
}
}
// colonne de tri primaire
if(@isset($params['prim']))
{
if(@isset($this->colonnes[$params['prim']]) && $this->colonnes[$params['prim']]['tri']==OUI)
{
$this->colonnes[$params['prim']]['prim'] = OUI;
if(!@isset($params['ordreprim']) || ($params['ordreprim']!=ASC && $params['ordreprim']!=DESC))
$params['ordreprim'] = ASC;
$this->colonnes[$params['prim']]['ordre'] = $params['ordreprim'];
$triprim = $this->colonnes[$params['prim']]['field']." ".$this->colonnes[$params['prim']]['ordre'];
}
}
// colonne de tri secondaire
if(@isset($params['sec']))
{
if(@isset($this->colonnes[$params['sec']]) && $this->colonnes[$params['sec']]['tri']==OUI)
{
$this->colonnes[$params['sec']]['sec'] = OUI;
if(!@isset($params['ordresec']) || ($params['ordresec']!=ASC && $params['ordresec']!=DESC))
$params['ordresec'] = ASC;
$this->colonnes[$params['sec']]['ordre'] = $params['ordresec'];
$trisec = $this->colonnes[$params['sec']]['field']." ".$this->colonnes[$params['sec']]['ordre'];
}
}
?>
echo "
Détail des commandes
                ";

        $trisec = (@isset($this->colonnes[$params['sec']]) && $this->colonnes[$params['sec']]['tri']==OUI)?$this->colonnes[$params['sec']]['field']." ".$this->colonnes[$params['sec']]['ordre']:"";
        $commandes = $_SESSION['BddAppliAchats']->executer(reqDetailCommandes($this->contremarque, $this->societe, $this->site, $this->bocdrive, $triprim, $trisec),__FILE__,__FUNCTION__,__LINE__);
        $affTab = new Tableau($this->colonnes,$this->div);
        $affTab->afficheEntete(__CLASS__,"contremarque".FIELD_SEPARATOR."bocdrive".FIELD_SEPARATOR."div".ROW_SEPARATOR.$this->contremarque.FIELD_SEPARATOR.$this->bocdrive.FIELD_SEPARATOR.$this->div,
                            __FUNCTION__,"prim".FIELD_SEPARATOR."ordreprim".FIELD_SEPARATOR."sec".FIELD_SEPARATOR."ordresec".ROW_SEPARATOR);

        foreach($commandes as $ligne)
            $affTab->afficheLigne($ligne);
    }
}
?>
Si tu as des questions, des remarques, n'ésites pas.

cs_bultez · Answer

>>Chaque classe a également ces fonctions JavaScript que je souhaite "écrire" en même temps que le tableau...

    regarde le lien... il y a des approches de solutions....

    je donne mon avis, qui n'a aucune espèce d'importance et ne vaut pas grand chose :
        j'éviterais.

    une fonction générale dans la page html à laquelle on passe des paramètres
        ( le tabelau qu'on traite... )

<hr />                Cordialement             Bul         [mon Site]     [M'écrire]

dmk04 · Answer

Ok merci.

Je continue sur l'autre post (ici).

Ajax et Javascript

5 réponses

Votre réponse

Discussions similaires