Ajax !!!!!!!!!!!

Pierrot · 08-11-2009 12:41:25

Saluton !!!
J'ai pris quelques jours de vacances et ayant abandonné le développement depuis 5 ans, j'ai voulu revenir a mes premiers amours .
Entendant parler partout d'AJAX et ne connaissant pas du tout cette technologie, j'ai voulu voir de que çà donne.
j'ai donc été pêcher quelques librairies sur internet, et j'ai mis tout cela à ma sauce
Il y a une librairie ajax, une librairie fenetre et une librairie grid.
Le librairie grid est 100% de moi :D
J'ai modifié les 2 autres pour qu'elles fonctionnent sous IE8, FireFox, Crome et quelles s'accordent dans l'ensemble.
Donc voici avec quelques ligne de code ce que l'on peu faire :

Le code javascript :

<script type="text/javascript"> 

  var nbdiv=0;

  var page=new Array();

  var tabtab= "";

  var nbwin=0

  function Appel_Ajax(xpage) {

      var param="page="+xpage;

      new Ajax_request('listindividu.php',{method:'post',params:param,onSuccess:succAjax,onError:ErrorAjax,async:false});

  }

  function  ErrorAjax(xhr) {

    alert('error : status =' +xhr.status);

  }

  function succAjax(xhr) {

    tabtab=xhr.responseText

  }

  function Eventbf(mydiv){ // appelée lors du click sur le bouton "[<<]" first

    page[mydiv]=1;

    Appel_Ajax(page[mydiv]);

    RefreshGrid(mydiv,tabtab);

  }

  function Eventbp(mydiv){ // prev

    page[mydiv]--;

    Appel_Ajax(page[mydiv]);

    RefreshGrid(mydiv,tabtab);

  }

  function Eventbn(mydiv){ // next

    page[mydiv]++;

    Appel_Ajax(page[mydiv]);

    RefreshGrid(mydiv,tabtab);

  }

  function Eventbl(mydiv){ // last

    page[mydiv]=-1;

    Appel_Ajax(page[mydiv]);

    RefreshGrid(mydiv,tabtab);

  }

  function ReturnTGrid(dparent){ // objet grid

    var xdiv= 'mygrid' + ++nbdiv;

    page[xdiv]=1;

    Appel_Ajax(page[xdiv]); 

    var typegrid= { idgrid : xdiv , 'divparent' : dparent , 

              tabldata : tabtab, 

              url : 'listindividu.php', 

              eventbf : function(){Eventbf(xdiv)},

              eventbp : function(){Eventbp(xdiv)},

              eventbn : function(){Eventbn(xdiv)},

              eventbl : function(){Eventbl(xdiv)},

              typeobj : "['label','label','label','label','label']",

              gwith : 500

            };

    return typegrid;

  }

  function CreateNewWin(){

    var windiv = "windiv" + ++nbwin;

    new popUp(50 , 100 , 510 , 310 , windiv , "" , "white" , "black" , "10pt sans-serif" , "Fenetre test" , "#0F72BB" , "white" , "lightgrey", "#6DBAF3" , "black" , true , true , true , true , false , false , 'min.gif' , 'max.gif' , 'close.gif' , 'resize.gif');

    var xx=ReturnTGrid(windiv+'_c');

    CreateNewGrid(xx);

  }

</script>

Le code php :

<?php
// chez free, y pas json_encode :D:D

  if ( !function_exists('json_decode') ){

    require_once ('JSON.php');

    function json_decode($content, $assoc=false){

      if ( $assoc ){

        $json = new Services_JSON(SERVICES_JSON_LOOSE_TYPE);

      } else {

        $json = new Services_JSON;

      }

      return $json->decode($content);

    }

  }

  if ( !function_exists('json_encode') ){

    require_once (dirname(__FILE__).'/JSON.php');

    function json_encode($content){

      $json = new Services_JSON;

      return $json->encode($content);

    }

  }

  include("connect.php");

  header("Content-Type: text/plain; charset=utf-8");

  $buffer="";

  $parpage=10;

  $page=$_POST['page'];

  $sql="SELECT COUNT(*) FROM individu";

  $countenreg=current(mysql_fetch_array(mysql_query($sql)));

  $countpages=ceil($countenreg/$parpage);

  if($page==-1){$page=$countpages;}; 

  if($page > $countpages){$page=1;};

  $debut=($page*$parpage)-$parpage;

  $sql="SELECT id,nom,prenom,type,matricule FROM individu ORDER BY nom,prenom LIMIT $debut,$parpage";

  $res=mysql_query($sql);

  $buffer="[[\"ID\",\"Nom\",\"Prenom\",\"Type\",\"Matricule\"],";

  $bcl=0; 

  while($row=mysql_fetch_row($res)){ 

    $buffer .= json_encode($row);

    $buffer .= (++$bcl < $parpage) ? "," : "";

  }

  $buffer .= "]";

  echo $buffer;

?>

Et le resultat :

http://safbiturbo.free.fr/grid/test3.html

pour info, la table comporte 1285 enregistrements.

Si ca interresse quelquessssssss personnes, je pourrais approfondir un peu la question et sortir un produit fini et de plus faire une documentation
Faite le moi savoir sur ce topic.

a++

Dernière modification par Pierrot (08-11-2009 12:47:15)

Pierrot · 09-11-2009 10:03:58

Je ne crois pas que ce soit le bon site pour causer AJAX
y a que des réfractaires ici :D
a++

Alnoss · 09-11-2009 10:49:04

bah, a coté de ça, bizarre que sur PHPdébutant, on parle pas trop d'autres choses que de PHP...

Réfractaire : non !
Spécialisé ... ça fait plus mieux meilleur ^^

Maljuna Kris · 09-11-2009 11:36:27

Saluton,
Je ne pense pas non plus qu'il s'agisse d'un quelconque baby duck syndrom.
Même si AJAX a connu son heure de gloire principalement au cours des trois dernières années, cela repose sur des techniques déjà anciennes.
Je crois qu'AJAX, qui s'appuie sur Javascript, (l'objet XHR qui en est le nerf de guerre est un objet javascript), souffre avant tout d'un a priori défavorable envers ce langage de script côté client pour des raisons liées à l'histoire de la sécurité sur le web.
Il est vrai que si JS est désactivé par l'internaute dans son navigateur, ce qui est malheureusement encore assez fréquent, le château de carte AJAX s'effondre sauf à disposer d'une alternative avec va et vient entre le navigateur et le serveur PHP.
La chose perd alors beaucoup de son intérêt.

Pierrot · 09-11-2009 11:39:15

>>bah, a coté de ça, bizarre que sur PHPdébutant, on parle pas trop d'autres choses que de PHP...

AJAX et php s'accordent très bien

bon, moi qui pensait vous faire plaisir, faire revivre un peu ce site

c'est pas grave

a++

Maljuna Kris · 09-11-2009 13:11:20

Pierrot a écrit :

AJAX et php s'accordent très bien

On peut même dire que, sans un script côté serveur (en PHP, PERL, ASP, NET, Java...), AJAX n'a plus de sens.

D'expérience, ici sur ces forums, les débutants se prennent assez vite les pieds dans les tapis dans le schéma de communication entre le script Javascript et le serveur.

En outre, le côté X d'AJAX, est souvent sous-utilisé, XML demeurant le côté obscur de la force pour le plus grand nombre.

Pierrot · 09-11-2009 13:50:31

>>XML demeurant le côté obscur de la force pour le plus grand nombre.

On peut tout a fait utiliser la technologie AJAX sans XML

La preuve, je n'utilise pas XML (beurk) mais JSON bien moins complexe

Enfin bref, vous en penser quoi de ma ptiote librairie ?

a++

Alnoss · 09-11-2009 14:12:02

1. je viens de sortir mes crayons de couleur, et je dis que c'est mieux avec la colorisation syntaxique

2. [mode stroumph grognon] meme avec la couleur, j'aime pas le java-script...[/mode]

3. en tout cas, le résultat est joli, fonctionnel... j'aurais juste fixé les largeurs de colonne pour éviter les déformations et uniformiser le tout

Pierrot · 09-11-2009 15:04:36

Alnoss a écrit :

j'aurais juste fixé les largeurs de colonne pour éviter les déformations et uniformiser le tout

Oki, je fais ça ce soir

function ReturnTGrid(dparent){ // objet grid

    var xdiv= 'mygrid' + ++nbdiv;

    page[xdiv]=1;

    Appel_Ajax(page[xdiv]);

    var typegrid= { idgrid : xdiv , 'divparent' : dparent ,

              tabldata : tabtab,

              url : 'listindividu.php',

              eventbf : function(){Eventbf(xdiv)},

              eventbp : function(){Eventbp(xdiv)},

              eventbn : function(){Eventbn(xdiv)},

              eventbl : function(){Eventbl(xdiv)},

              typeobj : "['label','label','label','label','label']",

              colwith  : "[50,100,100,100,100]",

              gwith : 500

            };

    return typegrid;

  }

Dernière modification par Pierrot (09-11-2009 15:05:09)

Pierrot · 10-11-2009 17:12:25

ca y es, c'est modifié
on peut aussi mettre des images et des case a cocher

ca donne ca :

function ReturnTGrid(dparent){ // objet grid

    var xdiv= 'mygrid' + ++nbdiv;

    page[xdiv]=1;

    Appel_Ajax(page[xdiv]);

    var typegrid= { idgrid : xdiv , 'divparent' : dparent ,

              tabldata : [["ID","Nom","Prénom","Photo"],["1","Schpounss","Pierrot","http://lurl/latof.jpg"],["2","Maljuna","Kris","http://lurl/laMOCHEtof.jpg"]];

              url : 'listindividu.php',

              eventbf : function(){Eventbf(xdiv)},

              eventbp : function(){Eventbp(xdiv)},

              eventbn : function(){Eventbn(xdiv)},

              eventbl : function(){Eventbl(xdiv)},

              typeobj : ['label','label','label','label','img'],

              colwith  : [50,100,100,100,100],

              gwith : 500

            };

    return typegrid;

  }

le dernier paramètre de colwith est ignoré ( mais fo le mettre qd meme). la largeur de la dernier collone sera egale ) gwith-totalwithcol(sauf la dernière).

bon, y pas une rubrique téléchargement sur phpdéb ( enfin mise a dispo ) ??

a++

Pierrot · 12-11-2009 14:23:37

Je n'ai pas eu de réponse a ma question
mais que font les modo's
a++

Alnoss · 12-11-2009 17:00:01

LOOOOL... les modos...modérent ^^

Par contre, pour la partie DL, l'admin ... heu... pas tapé Manicow ... pas tapééééééééé !!!!!!!

Pierrot · 12-11-2009 17:09:00

c'est bien ce que je pensais
y en a encore un kapafésontaff
a++

Alnoss · 13-11-2009 08:38:53

[mode Omar & Fred] Oulalalala, tu vas avoir des problèmes toi, de gros problèmes[/mode]

désolé pour la référence, ce n'est que l'inspiration du matin, au reveil ^^

Maskime · 13-11-2009 09:59:06

Hello,

je débarque dans le débat mais ça m'empêche pas de donner mon avis aussi
Le javascript pose de nombreux problème navigateur, c'est pour ça que pour ma part, si je peux éviter, j'évite... Maintenant c'est souvent bien pratique pour faire des vérifications de formulaires et autre joyeusetés de ce style, faire des vérifications ergonomique qui n'impose pas à l'utilisateur de rafraichir son formulaire...
Alors du coup pour ne pas me prendre la tête avec la partie chiante de JS, à savoir la gestion de navigateur (et qui respecte le DOM et quelles fonctions sont dispos pour ce navigateur etc etc...) j'utilise maintenant jQuery qui fonctionne franchement bien et qui, à ta décharge Pierrot, utilise aussi JSON comme moyen de retour.

MK : Faire du XML avec du JS c'est chiant comme la mort..., parcourir le XML relève de la gageure alors qu'avec JSON, un tableau et le monde est beau ^^

Pierrot · 13-11-2009 10:54:55

>>Le javascript pose de nombreux problème

le propre du métier de développeur consiste a régler les problèmes
C'est sûr que moins on en a, mieux c'est, mais le couple javascript/php (AJAX) permet d'avoir des applis bien plus dynamiques avec une énorme économie de bande passante
As tu été voir le lien que j'ai donné ?
Qu'en penses tu ?
JQuery est un superbe framework
J'èspere que dans quelque mois, mon framework concurrencera JQuery :D
D'ailleurs, si tu veut rejoindre "l'équipe" de dév, tu es le bienvenu
a++

Maskime · 13-11-2009 11:15:59

Héhé,

En ce qui me concerne, je suis plus en train de m'orienter vers du Flex pour faire ce genre de chose ^^
Et en effet ta grid a l'air bien pratique elle me fait un peu penser à celles que j'ai pu croiser quand j'ai fais du .Net (coïncidence ? ) Il lui faudrait une petite fonction de classement sur les colonnes ^^

Pierrot · 13-11-2009 11:23:33

>> Il lui faudrait une petite fonction de classement sur les colonnes

???

un tri ???

a++

Maskime · 13-11-2009 11:29:12

yop,

Mais je viens de lire un poste de MK qui dit qu'on trie les lentilles et qu'on classe les enregistrements ^^
Ce qui ne me semble pas complètement faux, parce que le tri veut bien dire que l'on sépare une chose d'une autre et non qu'on l'ordonne ^^

Pierrot · 13-11-2009 11:47:09

Pas de prob, "j'ordonne" pour ce soir

a++

Alnoss · 13-11-2009 11:51:13

on ordonne ou on classe ???

Non parce que là, on suit plus du tout

Maljuna Kris · 13-11-2009 12:44:55

Affaire classée !

Pierrot · 14-11-2009 14:11:30

Bon, tjs pas de lien pour le upload ???
je vé sévir
a++

Pierrot · 11-12-2009 14:43:36

Bon, je vais prendre encore qq jours de vacances
Donc, donnez moi tout plein d' idées pour mon pti framWk.
Je vous met les fonctions déjà existantes.

fonction sur les Fenetres :
popUp : cree une fenêtre
movePopup : repositionne une fenêtre
resizePopup : redimentionne une fenêtre
fadeboxin : ouvre une fenêtre
fadeboxout : ferme une fenêtre
hidebox : ferme une fenêtre
showbox : ouvre une fenêtre
changecontent : change le contenu d'une fenêtre

fonction sur le grid :
CreateNewGrid : cree un nouveau grid.
ReturnData : retourne le ligne selectionnee
ReturnDatas : retourne le totalitée des lignes
RefreshGrid : redessine un grid.
DestructGrid : detruit le grid (mais pas l'instance)
DestructGridComplet : detruit le grid

Fonction AJAX :
Ajax_request

a++

Pierrot · 20-12-2009 15:37:53

Personne n'a d'idées ?
a++

PHP|Débutant :: Forums

Advertisement

#1 08-11-2009 12:41:25

Ajax !!!!!!!!!!!

#2 09-11-2009 10:03:58

Re : Ajax !!!!!!!!!!!

#3 09-11-2009 10:49:04

Re : Ajax !!!!!!!!!!!

#4 09-11-2009 11:36:27

Re : Ajax !!!!!!!!!!!

#5 09-11-2009 11:39:15

Re : Ajax !!!!!!!!!!!

#6 09-11-2009 13:11:20

Re : Ajax !!!!!!!!!!!

#7 09-11-2009 13:50:31

Re : Ajax !!!!!!!!!!!

#8 09-11-2009 14:12:02

Re : Ajax !!!!!!!!!!!

#9 09-11-2009 15:04:36

Re : Ajax !!!!!!!!!!!

#10 10-11-2009 17:12:25

Re : Ajax !!!!!!!!!!!

#11 12-11-2009 14:23:37

Re : Ajax !!!!!!!!!!!

#12 12-11-2009 17:00:01

Re : Ajax !!!!!!!!!!!

#13 12-11-2009 17:09:00

Re : Ajax !!!!!!!!!!!

#14 13-11-2009 08:38:53

Re : Ajax !!!!!!!!!!!

#15 13-11-2009 09:59:06

Re : Ajax !!!!!!!!!!!

#16 13-11-2009 10:54:55

Re : Ajax !!!!!!!!!!!

#17 13-11-2009 11:15:59

Re : Ajax !!!!!!!!!!!

#18 13-11-2009 11:23:33

Re : Ajax !!!!!!!!!!!

#19 13-11-2009 11:29:12

Re : Ajax !!!!!!!!!!!

#20 13-11-2009 11:47:09

Re : Ajax !!!!!!!!!!!

#21 13-11-2009 11:51:13

Re : Ajax !!!!!!!!!!!

#22 13-11-2009 12:44:55

Re : Ajax !!!!!!!!!!!

#23 14-11-2009 14:11:30

Re : Ajax !!!!!!!!!!!

#24 11-12-2009 14:43:36

Re : Ajax !!!!!!!!!!!

#25 20-12-2009 15:37:53

Re : Ajax !!!!!!!!!!!

Pied de page des forums