[Smarty] Pb d'inclusion de script JS

**pc.bertineau** · 30/05/2007, 17h29

Bonjour,

j'ai un pb pour inclure un script javascript avec smarty. si j'inclus ce script dans mon header html, il est pris en compte mais mes éléments html créés avec smarty ne sont pas pris en compte..
tous mes divs de mise en page sont mis à jour avec de l'ajax.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
{literal}
<script type="text/javascript" src="js/DatePicker.js"></script>
{/literal}
 
<!-- tableau invisible, sert pour le calendrier -->
<table class="ds_box" cellpadding="0" cellspacing="0" id="ds_conclass" style="display:none;">
<tr><td id="ds_calclass"></td></tr>
</table>

par exemple ici, mon script DatePicker.js (qui n'est pas de moi) fait un

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

ds_oe = document.getElementById('ds_calclass');

IE me retourne une erreur : 'ds_oe' a la valeur Null ou n'est pas un objet..

PS: J'ai essayé en enlevant les balises {literal} et ce n'est pas mieux...

**eric.pommereau** · 30/05/2007, 19h09

Bonjour,

L'utilisation de {LITERAL} ne se justifie pas dans ce cas de figure (inclusion d'un script).

Pour le reste je ne vois qu'une erreur dans les chemins d'inclusion (dans ta déclaration) ou bien une incompatibilité quelconque (mais je ne pense pas).

Pour ce problème en particuler, avec FireFox et l'extension FireBug tu pourrais voir en deux coups de cuillère à pôt si ton script est bien récupéré par le navigateur. Je t'ai joint une copie d'écran pour voir ce que ça donne avec le un des script .js de ce forum.

Si ce n'est pas ça le soucis peux tu préciser comment ton template est appelé en postant le code concerné.

Merci @+

**pc.bertineau** · 31/05/2007, 10h34

Bonjour Eric,

Merci pour ton tuto Smarty, je m'en sers beaucoup en ce moment !

Voici les symptômes :

Si le script est inséré dans le header html de mon index.php (seule page du site, tout est en ajax), alors le script est reconnu, l'erreur produite annonce qu'il ne reconnaît pas un objet de type <td>, alors que son id est bon..

Si le script est inséré dans le div où est présent l'objet <td> en question, et donc inséré via Smarty, la fonction appelée n'est même pas reconnue (Objet requis), ce qui me pousse à croire que le script n'est pas pris en compte. Pour autant il apparaît dans Firebug, tout comme mes éléments <td> requis...

Pour les appels à Smarty :

Un fichier contenu.php s'occupe d'appeler le bon script php en fonction du contenu demandé.

Ici c'est dt_form.php qui appelle mon template :

Code PHP :

Sélectionner tout - Visualiser dans une fenêtre à part

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
53
54
55
56
<?php
session_start();
 
require_once('Smarty.class.php');
$template = new Smarty();
$template->template_dir = 'c:/wamp/php/pear/tpl/dt/';
$template->compile_dir = 'c:/wamp/php/pear/tpl_c/';
 
 
 
if (!isset($_POST['form_state']))
{
    $date1 = date('d-m-Y');
    $heure = date('H:i');
 
    //======================================================================
    // On assigne un tableau statique pour simuler la bdd
    //======================================================================
 
    //==========================   Imputations   ===============================
    $imput = Array('Faites votre choix','30 080 X85','30 100 W44 RS','30 150 K4 RS','30 620 Mégane RSD');
    $imput_index = Array(0,1,2,3,4);
    $imput_selected = 0;
    $template->assign('imput', $imput);
    $template->assign('imput_index', $imput_index);
    $template->assign('imput_selected', $imput_selected);
    //=======================================================================
 
    //============================   Supports   ================================
    $support = Array('Faites votre choix','Banc','Chaîne cinématique','Moteur','Véhicule','Autre');
    $support_index = Array(0,1,2,3,4,5);
    $support_selected = 0;
    $template->assign('support', $support);
    $template->assign('support_index', $support_index);
    $template->assign('support_selected', $support_selected);
    //=======================================================================
 
    //=========================   Types de travaux   ============================
    $typtrav = Array('Acoustique','Caisse','GMP','GMP - Boîte','GMP - Moteur','LAS','Synthèse');
    $typtrav_index = Array(0,1,2,3,4,5,6);
    $template->assign('typtrav', $typtrav);
    $template->assign('typtrav_index', $typtrav_index);
    //=======================================================================
 
    $template->assign('demandeur',$_SESSION['user_name']);
    $template->assign('datedem',$date1);
    $template->assign('heure',$heure);
}
elseif (isset($_POST['']) && ($_POST[''] == 'dt1'))
{
 
}
 
 
$template->display('dt_form1.tpl');
?>

et voici le dt_form1.tpl dont il est question :

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

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
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
<link rel="stylesheet" type="text/css" href="/css/date.css" />
<!-- tableau invisible, sert pour le calendrier -->
<table class="ds_box" cellpadding="0" cellspacing="0" id="ds_conclass" style="display:none;">
<tr><td id="ds_calclass"></td></tr>
</table>
<script type="text/javascript" src="/js/DatePicker.js"></script>

<h1>R&eacute;diger une DT</h1>

<form name="dt_form1" method="POST" action="dt_form.php">
    <div class="form_block">
    <table rules="none" width="90%" border="0">
        <tr><td><span class="label">Demandeur : </span></td><td>{$demandeur}<input type="hidden" name="dem" value="

{$demandeur}"/></td></tr>
        <tr><td><span class="label">Date : </span></td><td>{$datedem}<input type="hidden" name="datedem" value="{$datedem}"/

></td></tr>
        <tr><td><span class="label">Heure : </span></td><td>{$heure}<input type="hidden" name="heuredem" value="{$heure}"/><

/td></tr>
    </table>
    </div>

    <div class="form_block">
    <table rules="none" width="90%" border="0">
        <tr><td><span class="label">Imputation : </span></td>
            <td><select class="champ" name="select_imput">
                {html_options values=$imput_index selected=$imput_selected output=$imput}
            </select></td>
        </tr>
        <tr><td><span class="label">Support : </span></td>
            <td><select class="champ" name="select_support">
                {html_options values=$support_index selected=$support_selected output=$support}
            </select></td>
        </tr>
        <tr><td colspan="2"><div id="support">support</div></td></tr>
    </table>
    </div>

    <div class="form_block">
    <table rules="none" width="90%" border="0">
        <tr><td><span class="label">Date délai : </span></td><td><input name="datedelai" value="cliquez..." type="text" size

="10" maxlength="10" onclick="ds_sh(this);" onfocus="ds_sh(this);" /></td></tr>
    </table>
    </div>

    <div class="form_block">
        <span class="label">Types de Travaux : </span>
        <div>{html_checkboxes name=typtrav values=$typtrav_index output=$typtrav}</div>
    </div>

    <div class="form_block">
    <table rules="none" width="90%" border="0">
        <tr><td><span class="label">Nature : </span></td><td><input name="nature" type="text" size="100" maxlength="80" /></

td></tr>
        <tr><td><span class="label">Objectif : </span></td><td><input name="objectif" type="text" size="100" maxlength="80" 

/></td></tr>
    </div>
    
    <!-- cet input caché sert à transmettre l'étape de remplissage du formulaire-->
    <input type="hidden" name="form_state" value="dt1" />
    
    <table rules="none" border="0" style="width:760px;margin-top:30px;">
        <tr><td style="text-align:left;"><a disabled="disabled">Etape pr&eacute;c&eacute;dente</a></td><td style="text-align

:right"><a href="#">Etape suivante</a></td></tr>
    </table>
    
</form>

Les chemins que j'ai indiqués sont relatifs à la racine web (c:/wamp/www/).
J'ai aussi essayé en mettant des chemins relatifs au dossier du tpl (c:/wamp/php/PEAR/tpl/dt/)
Rien de tout ça ne marche...
Même problème avec des chemins absolus..

Autre indication :
Dans FireBug, mes divs sont bien mis à jours dans le code HTML (le script est présent dans mon div de contenu), mais quand je clique sur Script, le code correspond à la page d'accueil tout le temps. Ceci est dû à l'utilisation d'ajax, mais est-ce pour autant normal ??

En tout cas merci..

**eric.pommereau** · 31/05/2007, 12h48

Bonjour,

Finalement je pense qu'il ne s'agit que de lieu d'insertion de ton javascript (ce que tu as remarqué dailleurs...)

Si ton script placé dans le header

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

ds_oe = document.getElementById('ds_calclass');

Il est normal qu'il provoque une erreur puisque le navigateur n'a pas fini de charger la page à ce moment du script (enfin je pense ...). Pour parer ce problème tu as plusieurs solutions dont la mise en place du script après l'élément HTML concerné (en l'occurence celui dont l'identifiant est 'ds_calclass') ou bien de créer une fonction appelée quand la page a fini d'être chargée (onLoad() de body ?)

Le problème est donc selon moi plus javascript que SMARTY ou PHP.

@+

**pc.bertineau** · 31/05/2007, 13h42

Le problème, c'est que pour insérer mon script js autre part que dans le header, je dois l'insérer avec Smarty, et je n'y arrive pas. Mon script n'est jamais détecté lorsque je le mets dans un .tpl .

cf :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
<link rel="stylesheet" type="text/css" href="/css/date.css" />
<!-- tableau invisible, sert pour le calendrier -->
<table class="ds_box" cellpadding="0" cellspacing="0" id="ds_conclass" style="display:none;">
<tr><td id="ds_calclass"></td></tr>
</table>
<script type="text/javascript" src="/js/DatePicker.js"></script>

Même comme ça, j'ai une erreur type Objet requis, ds_sh n'est pas définie.
ds_sh est la fonction appelée par mon champ input datedelai. Pour moi ça signifie que le script js n'est pas détecté puisque sa fonction "mère" n'est pas trouvée.

Le problème vient peut-être du chemin que j'indique. Dans un tpl, les chemins relatifs sont-ils vus du point de vue du fichiers .tpl (chez moi c'est le pear de php) ou alors de la racine du site web (/www/) comme du code html totalement intégré (à mon avis ce devrait être cette 2nde solution) ?

indic: le chemin absolu de mon script js : C:/wamp/www/js/DatePicker.js

**pc.bertineau** · 31/05/2007, 15h10

Je commence à me demander si des éléments insérés avec Smarty ne seraient pas mal pris en compte dans l'arborescence DOM...

**eric.pommereau** · 31/05/2007, 15h52

Normalement ça n'a rien à voir...

**pc.bertineau** · 31/05/2007, 16h28

Je me demande si c'est pas l'insertion par une fonction Ajax qui fait perdre le DOM, j'avais déjà eu ce pb..
Le pb se vérifie avec d'autres scripts que j'aimerais insérer. J'y arrive en les mettant dans le header mais pas en les injectant dans le contenu de mon code html..

Je vais essayer de contourner mais j'aime jamais ça... Surtout que je vais devoir répéter tout ça sur plusieurs pages. M'enfin, je tiens au courant si je trouve une solution à peu près propre.

[Smarty] Pb d'inclusion de script JS

Bibliothèques et frameworks PHP

Discussions similaires

Partager

Partager