Javascript et php

Version imprimable

Voir 40 message(s) de cette discussion en une page

05/08/2013, 15h59
Madusa

Javascript et php

Bonjour,

Est il pr�f�rable de mettre du javascript dans du php ou inversement?
05/08/2013, 16h04
SpaceFrog

heu ...

Il faut r�fl�chir � la chronologie ...

Consid�re que php est une machine � ecrire qui g�n�re ton code html/javascript
le serveur n'interp�te pas le js
le navigateur n'interpr�te pas le php

Donc chronologiquement
php r�dige le code html js sur le serveur et l'envoie vers le navigateur
le navigateur ne doit recevoir que du html /js toute ligne de php re�ue par le navigateur ne sera pas interpr�t�e ...
05/08/2013, 16h47
SpaceFrog

ajax permet de retourner chercher des informations sur le serveur sans recharger la page.
ajax est du js ...
ajax pointe sur une page sur le serveur (page php par exemple) qui s'execute cot� serveur et retourne du string au navigateur
05/08/2013, 17h08
Invit�

Citation:

Envoy� par SpaceFrog

... et retourne du string au navigateur

Vamos a la playa ! 8-)
05/08/2013, 17h16
SylvainPV

La meilleure r�ponse est ni l'un ni l'autre. Si tu en viens � te poser la question, c'est que tu penses mettre du Javascript directement dans tes pages PHP. Ce qui fait trois langages m�lang�s : PHP, HTML et Javascript. Autrement dit un gros bazar imbitable. Pour gagner en lisibilit�, il faut tout faire pour les s�parer.

Les d�veloppeurs impr�gn�s de la culture PHP ont l'habitude de m�langer PHP et HTML pour la g�n�ration de leurs vues sans que �a ne les d�range trop. Personnellement je d�teste �a, et par voie de cons�quence je n'aime pas beaucoup le PHP m�me si j'ai fait pas mal de projets avec.

J'utilise �norm�ment le Javascript pour la g�n�ration de mes vues (templating c�t� client) et j'essaie au maximum de s�parer la couche vue (le HTML) et de la couche data (web services me retournant mes donn�es en JSON). Tous mes Javascript sont dans des fichiers externes charg�s via l'attribut src des balises script (ou un script loader pour les besoins plus sophistiqu�s).

Pour les fans de l'�l�phant, j'imagine que la bonne pratique est de ne pas mettre de Javascript en inline dans la page (m�me si �a se voit tr�s souvent sur ces forums et source d'innombrables bugs)

Ici tu as une adaptation de ton sch�ma de donn�e qui proviendra de ta requ�te doit �tre mod�lis� et affect� a une variable et bien entendu converti en json c'est la mod�lisation de tes donn�es php pour js sorte de "dataset".

Ton sch�ma doit a tout prix ressemble a celui l� :
Code:

1 2 3 4 5 6 7 8 9 10 { columns: [ { field: "date" }, { field: "name" }, { field: "desc" }, { field: "location" } ], }
Tu pourrait faire un truc du genre :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 $data_set = 0; ... $data_set = "{/n"; while($rows_pro=mysql_fetch_assoc($res_pro){ $data_set .= "columns: [/n"; $data_set .= "field: " . $rows_pro['date'] . "},/n"; $data_set .= "field: " . $rows_pro['desc'] . "},/n"; $data_set .= "field: " . $rows_pro['location'] . "},/n"; $data_set .= "],/n"; } $data_set .= "}";
Et ensuite tu utilise ta variable $data_set directement dans ton script js comme ceci :
Code:

1 2 3 4 var data_set = <?php echo $data_set; ?> console.log(data_set.columns[0].field[0] //date); console.log(data_set.columns[0].field[1] //desc);
J'ai pas test� mais la logique et l�, on aurait pu pass� par un array_push et un json_encode mais c'�tait pour bien voir la logique.

05/08/2013, 22h34
headmax
Le deuxi�me bloc de code c'est pour affect� a ton js donc :
Code:

1 2 3 <script> $("#grid").kendoGrid(<?php echo $data_set; ?>);
Il s'agit du sh�ma de donn�e que dois avoir ton js pour fonctionner.
05/08/2013, 22h40
headmax

Le m�lange est malheureusement obligatoire, mais il ne s'agit qu'une affectation et pas un gros traitement des donn�es.

Le traitement des donn�es pour obtenir le sch�ma js et fait en php sans m�lange, par contre pour affecter le sch�ma de donn�e provenant de PHP doit a un moment ou un autre �tre affect� au DOM par le biais du variable js, tu ne peux pas faire autrement.
05/08/2013, 22h48
headmax
Au niveau PHP
Fait un echo et un var_dump de $data_set v�rifie que ton sch�ma de donn�e et bien le m�me que celui du js.

Au niveau JS
Fait un
Code:

1 2 3 console.log(<?php echo $data_set; ?>); console.log(typeOf(<?php echo $data_set; ?>));
Dit moi ce que tu obtiens?

je suis compl�tement perdu et ne sait quoi �crire dans mon code...:cry:Je suis au niveau de :

Code:

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
 
<head>
    <title></title>
    <link href="styles/kendo.common.min.css" rel="stylesheet" />
    <link href="styles/kendo.default.min.css" rel="stylesheet" />
    <script src="js/jquery.min.js"></script>
    <script src="js/kendo.all.min.js"></script>
</head>
<body>
<?php include("menu.php"); ?>
 
<?php include("connexionbdd.php"); // query for the definition, type of this problem
?>
<?php 
 
$sql_pb="SELECT * from problem where id_Pb=1";
$res_pb=mysql_query($sql_pb);
$rows_pb=mysql_fetch_assoc($res_pb);
 
 
?></br></br></br></br>Definition:   <?php echo $rows_pb['def_Pb'];
$var=$rows_pb['id_Pb_Type']
 
 ?> </br></br>
 <script src="people.js"></script>
 
        <div id="example" class="k-content">
            <div id="clientsDb">
 
                <div id="grid" style="height:580px"></div>
 
            </div>
 
            <style scoped>
                #clientsDb {
                    width: 892px;
 
                    margin: 40px auto;
                    padding:2px 4px 0 4px;
 
                }
            </style>
            <div id="grid"></div>
<div id="grid"></div>
<script>
$("#grid").kendoGrid({
  columns: [
    { width:100, field: "date" },
    { field: "name" },
	{ field: "desc" },
	{ field: "location" }
  ],
 groupable: true,
                        sortable: true,
                        pageable: {
                            refresh: true,
                            pageSizes: true
                        },
}
);

05/08/2013, 22h51
headmax

D�sol� pour le

Code:

$data_set = 0;

c'est pour initialiser la variable en PHP tu peux ne pas la mettre si tu set d�j� ta donn�e au pr�alable oubli cette ligne.
05/08/2013, 22h56
headmax
D�sol� mais j'ai pas eu notion du code
Code:

1 2 var dataSource = new kendo.data.DataSource({
Peut tu montrer tout ce code lors de la cr�ation de ton objet DataSource.
05/08/2013, 23h05
headmax

Ok peut tu me faire un screenshot des champs de ta db pour les tables car il me semble que tu peux faire tout en une seule requ�te avec des jointures et la tu utilise une requ�te par champs ce qui ne faut surtout pas faire.

Ou �num�rer les champs des tables et leur relation car il faut que tu optimise ta requ�te � un acc�s au lieux de plusieurs.
05/08/2013, 23h26
Madusa

1 pi�ce(s) jointe(s)

Voici les screenshots :D

PHP

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
 
<?php 
$sql_inc="SELECT id_Inc,id_Pb,name_Inc,desc_Inc,date_Inc,id_Loc FROM incident LEFT JOIN location ON incident.id_Loc = location.id_Loc where id_Pb=1 ORDER BY date_Inc DESC LIMIT 5 ";
$res_inc=mysql_query($sql_inc);
 
while($rows_inc=mysql_fetch_assoc($res_inc)){
$data_set .= "{/n";
$data_set .=  "data: [/n";
$data_set .=   "{/n";
$data_set .=     "date:'"     . $rows_inc['date_Inc'] . "',/n";
$data_set .=     "name:'"     . $rows_inc['name_Inc'] . "',/n";
$data_set .=     "desc:'"     . $rows_inc['desc_Inc'] . "',/n";
$data_set .=     "location:'" . $rows_inc['id_Loc']   . "'/n";
$data_set .=   "}/n";
$data_set .=         "]/n";
$data_set .= "}";
}
?>

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
 
<script>
$("#grid").kendoGrid({
  columns: [
    { field: "date" },
    { field: "name" },
	{ field: "desc" },
	{ field: "location" }
  ],
 groupable: true,
                        sortable: true,
                        pageable: {
                            refresh: true,
                            pageSizes: true
                        },
});
 
var dataSource = new kendo.data.DataSource(<?php echo $data_set; ?>);
 
var grid = $("#grid").data("kendoGrid");
grid.setDataSource(dataSource);
</script>

Merci pour le SS j'ai fait une jointure pour faire en une seule requ�te l'acc�s en DB.
Apr�s j'ai pas test� mais voici le principe.

05/08/2013, 23h43
headmax

Le /n est un saut de ligne peut �tre qu'il est a l'envers j'ai fait �a sous nopad m�me pas le ++ donc j'ai pas la coloration syntaxique sur mon �diteur.

Pour l'erreur de la requ�te peu tu me la donner l'erreur?

Essaye :
Code:

1 2 $sql_inc="SELECT tb_i.id_Inc,tb_i.id_Pb,tb_i.name_Inc,tb_i.desc_Inc,tb_i.date_Inc,tb_i.id_Loc FROM incident tb_i LEFT JOIN location tb_l ON tb_i.id_Loc = tb_l.id_Loc where tb_i.id_Pb=1 ORDER BY tb_i.date_Inc DESC LIMIT 5 ";
J'ai mit deux Alias dans la requ�te tb_i pour la table incident et tb_l pour la table location.

Essaye d'executer dans ton PHPmyadmin du SS cette requ�te directement.

Code:

1
2
 
SELECT tb_i.id_Inc,tb_i.id_Pb,tb_i.name_Inc,tb_i.desc_Inc,tb_i.date_Inc,tb_i.id_Loc FROM incident tb_i LEFT JOIN location tb_l  ON tb_i.id_Loc = tb_l.id_Loc where tb_i.id_Pb=1 ORDER BY tb_i.date_Inc DESC LIMIT 5

05/08/2013, 23h54
Madusa
J'ai maintenant plus de probl�me avec la requete mais l'erreure suivante:
Undefined variable: data_set � la deuxi�me ligne:
Code:

1 2 while($rows_inc=mysql_fetch_assoc($res_inc)){ $data_set .= "{/n";
05/08/2013, 23h56
headmax

Supprime tout les /n du code et retest.

Voir 40 message(s) de cette discussion en une page