Tutoriel : Le framework puzzleApp

Plus qu'un tutoriel vous retrouvez ici le détail du coeur du framework

Le javascript Partie 2

Dans le tutoriel précédent vous avez pu découvrir comment est implémenté le javascript. Vous découvrirez ici les principales fonctions.

1. Lancer une requete Ajax :

//Préparation des données
var data = "Class=Blog&Methode=RefreshCategory&App=Blog";
    data  = "&blogId="   blogId;

    Request.Post("Ajax.php", data).then(data=>{
       
        console.log(data);
    }
);

 

Cette requête va automatiquement appeler la class Blog de l'application Blog et la fonction RefreshCategory. Vous pouvez alors retourner du json ou du html au choix.

 

Les fonctions suivantes utilisent la bibliothéque Dashboard, pensez donc à l'inclure avec la ligne ci-dessous

    <script src='{{GetPath(/script.php?s=Dashboard)}}' ></script>  

 

2. Chargement d'un control 

 

var data = "Class=Blog&Methode=RefreshCategory&App=Blog";
    data  = "&blogId="   blogId;

Dashboard.LoadControl("tab_1", data, "" , "div", "Blog");

Cette méthode va automatiquement remplacer le contenu de l'element tab_1 avec le retour de la requête

Cette fonction attend trois arguments 

  • search : L'id de l'element à charger
  • data : les données transmise
  • height : la hauteur si vous souhaitez définir un taille
  • balise : le type de balise recherché
  • appName : le nom de l'application ( reservé esapce administrateur) 

 

3. Ajouter des Listener sur les contrôles

Afin de gérer les interaction coté client, il faut gérer les évenements sr les controles par exemple OnClick, OnMouseOver, OnBlur . Il existe alors deux méthodes 

  

Dashboard.AddEvent(img, "click", FormAction.DelResponse);

/**
 * Supprime une réponse
 **/
FormAction.DelResponse = function(e)
{
    control = e.srcElement || e.target;
    FormAction.DeleteResponse(control);
};


Dashboard.AddEventById("btnNewProjet", "click", NetworkAction.ShowAddProjet);

 

4. Ouvrir une Popup

 /**
  * Pop in d'envoi de message
  * @type type
  */
  MessageAction.ShowSendMessage = function()
  {
     var param = Array();
         param['App'] = 'Message';
         param['Title'] = 'Message.ShowSendMessage';
              
   Dashboard.OpenPopUp('Message','ShowSendMessage', '','','','MessageAction.RefreshNumberMessage()', serialization.Encode(param));
   };

Cette fonction attend les paramétres suivants

  • La classe qui va gérer l'appel
  • La méthide qui va gérer l'appel
  • L'url, si vous souahitez afficher une IFrame d'une url spécifique
  • La largeur de la popup
  • La hauteur de la popup
  • La fonction appelé lors de la fermeture de la popup (en général pour rafraichir l'écran en dessous)
  • Les paramétres serialisé : Vous receverez tous ces paramétres alors en Post dans votre fonction. 

Ne pas oublier la param['App']  pour l'application visé et le param['Title']  poru le titre de la popup