Lists (jqm1000)
De Wiki1000
(Différences entre les versions)
Ligne 68 : | Ligne 68 : | ||
===Grille de détails=== | ===Grille de détails=== | ||
+ | Un détail est constitué d'une liste d'éléments retournés dans un tableau. | ||
+ | |||
+ | La liste peut contenir deux types d'entrée : | ||
+ | * Les entrées simple, sans action associée (pas de membre "l"). | ||
+ | * Les entrées avec une action associe (avec membre "l") | ||
+ | |||
+ | Les entrées simples sont affichées dans une grille à deux colonnes, la première affiche le titre (t) et la seconde la valeur (v). | ||
+ | |||
+ | Les entrées avec action associée sont affichées ensuite en liste verticale. | ||
+ | |||
Le JSON doit retourner un tableau de structures : | Le JSON doit retourner un tableau de structures : | ||
<pre> | <pre> | ||
Ligne 76 : | Ligne 86 : | ||
"v": "BARRES SA" | "v": "BARRES SA" | ||
}, | }, | ||
+ | .... | ||
{ | { | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
"l": "l", | "l": "l", | ||
+ | "v": "01 41 66 24 10", | ||
"h": "tel:01 41 66 24 10" | "h": "tel:01 41 66 24 10" | ||
}, | }, | ||
{ | { | ||
− | |||
− | |||
"l": "m", | "l": "m", | ||
+ | "v": "Google map", | ||
"h": "221, avenue Charles de Gaulle,92200,FRANCE" | "h": "221, avenue Charles de Gaulle,92200,FRANCE" | ||
}, | }, | ||
{ | { | ||
− | |||
− | |||
"l": "d", | "l": "d", | ||
+ | "v": "view last orders", | ||
"h": "/orders", | "h": "/orders", | ||
"id": "E16F5913EED000310032000000A30000" | "id": "E16F5913EED000310032000000A30000" | ||
}, | }, | ||
{ | { | ||
− | |||
− | |||
"l": "c", | "l": "c", | ||
+ | "v": "view product charts", | ||
"h": "/products", | "h": "/products", | ||
"id": "E16F5913EED000310032000000A30000" | "id": "E16F5913EED000310032000000A30000" | ||
Ligne 117 : | Ligne 112 : | ||
} | } | ||
</pre> | </pre> | ||
− | |||
− | |||
{|class="wikitable" | {|class="wikitable" | ||
Ligne 139 : | Ligne 132 : | ||
|id | |id | ||
|id (oid) de l'objet associé au lien | |id (oid) de l'objet associé au lien | ||
+ | |- | ||
+ | |idf | ||
+ | |id du conteneur de la valeur (span) | ||
+ | |- | ||
+ | |afs | ||
+ | |Liste d'actions exécutées après le succès de l'action | ||
+ | |- | ||
+ | |afe | ||
+ | |liste d'action exécutées après l'échec de l'action | ||
+ | |- | ||
+ | |bfa | ||
+ | |liste d'action exécutées avant l'action | ||
+ | |- | ||
+ | |ico | ||
+ | |Nom de l'image associé au bouton. | ||
|} | |} | ||
− | Type de lien : | + | Type de lien (valeur du membre "l") : |
{|class="wikitable" | {|class="wikitable" | ||
|- | |- | ||
− | ! | + | !Type |
!Usage | !Usage | ||
!h | !h | ||
Ligne 189 : | Ligne 197 : | ||
|Méthode retournant le document ou l'image | |Méthode retournant le document ou l'image | ||
|Identifiant du document ou de l'image | |Identifiant du document ou de l'image | ||
+ | |- | ||
+ | |i | ||
+ | |Information | ||
+ | | | ||
+ | | | ||
|} | |} | ||
Ligne 214 : | Ligne 227 : | ||
json.result[0].v := inst.company; | json.result[0].v := inst.company; | ||
// | // | ||
− | + | ... | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
// | // | ||
json.result[4].t := 'tel'; | json.result[4].t := 'tel'; |
Version du 7 avril 2014 à 12:51
La gestion d'une liste maître détail met en oeuvre deux étapes :
- Dans une première étape une liste d'élément est recherché et affichée
- Dans une seconde étape le détail d'un élément de la liste est affiché.
Liste maître
Le JSON doit retourner un tableau de structure
{"result":[{"id":"E16F5913EED000310032000000A30000","name":"BARRES SA"},{....}]}
Chaque structure sera affichée comme une entrée de la liste.
Exemple :
//Procedure search(req:TJson; var res:TObject); Type CustomerAddressView = ViewOf(TClient) company: string = tiers.raisonSociale; street: string = sitePrivilegie.adresse.nomRueVoie; zipCode: string = sitePrivilegie.adresse.codePostal; country: string = sitePrivilegie.adresse.pays.code; town: string = sitePrivilegie.adresse.ville; end; var ls:TSelector; inst:CustomerAddressView; json:TJson; indx:Integer; AWhere,stag:string; Args:Array[0..1] of variant; begin json := TJson.Create(''); // Search criteria ////////////////// AWhere := ''; stag := ''; if req.Exists('zipCode') then begin AWhere := AWhere+stag+'(zipCode like %1)'; Args[0] := req.zipCode+'%'; stag := 'and'; end; if req.Exists('town') then begin AWhere := AWhere+stag+'(town like %2)'; Args[1] := req.town+'%'; stag := 'and'; end; // Create the cursor ls := CustomerAddressView.CreateSelector(AWhere,'',true,Args); foreachP inst in ls.AsCursor index indx do begin // where we build the response ////////////////////////////// json.result[indx].id := inst.OID; json.result[indx].name := inst.company; end; // manage empty result if json.isEmpty then begin json.result[0].id := ''; json.result[0].name := 'No result'; end; res := json; end;
Grille de détails
Un détail est constitué d'une liste d'éléments retournés dans un tableau.
La liste peut contenir deux types d'entrée :
- Les entrées simple, sans action associée (pas de membre "l").
- Les entrées avec une action associe (avec membre "l")
Les entrées simples sont affichées dans une grille à deux colonnes, la première affiche le titre (t) et la seconde la valeur (v).
Les entrées avec action associée sont affichées ensuite en liste verticale.
Le JSON doit retourner un tableau de structures :
{ "result": [ { "t": "customer", "v": "BARRES SA" }, .... { "l": "l", "v": "01 41 66 24 10", "h": "tel:01 41 66 24 10" }, { "l": "m", "v": "Google map", "h": "221, avenue Charles de Gaulle,92200,FRANCE" }, { "l": "d", "v": "view last orders", "h": "/orders", "id": "E16F5913EED000310032000000A30000" }, { "l": "c", "v": "view product charts", "h": "/products", "id": "E16F5913EED000310032000000A30000" } ] }
Membre | Usage |
---|---|
t | Titre d'une entrée détail, affichée dans la première colonne |
v | Valeur de l'entrée, affichée dans la seconde colonne |
l | L'entrée est de type lien, la valeur de l détermine le type de lien |
h | href du lien |
id | id (oid) de l'objet associé au lien |
idf | id du conteneur de la valeur (span) |
afs | Liste d'actions exécutées après le succès de l'action |
afe | liste d'action exécutées après l'échec de l'action |
bfa | liste d'action exécutées avant l'action |
ico | Nom de l'image associé au bouton. |
Type de lien (valeur du membre "l") :
Type | Usage | h | id |
---|---|---|---|
a | Exécuter une action | Nom de la méthode à exécuter | Valeur de l'identifiant à passer dans la structure req (id) |
l | Lien html | href du lien | |
d | Lien sous détails | Méthode retournant le sous détail | Identifiant de sous requête. |
g | Sous détails | Méthode retournant le sous détail | Identifiant de sous requête. |
m | Lien de type map | Adresse au format Google | |
c | Lien de type chart | Méthode retournant les données du Chart | Identifiant de sous requête. |
p | Naviguer sur une page | ||
di | Afficher un document ou une image | Méthode retournant le document ou l'image | Identifiant du document ou de l'image |
i | Information |
Exemple :
//Procedure details(req:TJson; var res:TJSon); Type CustomerAddressView = ViewOf(TClient) company: string = tiers.raisonSociale; street: string = sitePrivilegie.adresse.nomRueVoie; town: string = sitePrivilegie.adresse.ville; zipCode: string = sitePrivilegie.adresse.codePostal; phone: string = sitePrivilegie.adresse.telephone1; country: string = sitePrivilegie.adresse.pays.Caption; end; var inst:CustomerAddressView; json:TJson; begin json := TJson.Create(''); inst := CustomerAddressView.Find('oid=%1','',true,[req.id]); if Assigned(inst) then begin json.result[0].t := 'customer'; json.result[0].v := inst.company; // ... // json.result[4].t := 'tel'; json.result[4].v := inst.phone; json.result[4].l := 'l'; json.result[4].h := 'tel:'+inst.phone; // json.result[5].t := 'locate'; json.result[5].v := 'Google map'; json.result[5].l := 'm'; json.result[5].h := inst.street+','+inst.zipCode+','+inst.country; // json.result[6].t := 'orders'; json.result[6].v := 'view last orders'; json.result[6].l := 'd'; json.result[6].h := '/orders'; json.result[6].id:= inst.OID; // json.result[7].t := 'products'; json.result[7].v := 'view product charts'; json.result[7].l := 'c'; json.result[7].h := '/products'; json.result[7].id:= inst.OID; end; if json.isEmpty then begin json.result[0].t := 'Customer not found'; json.result[0].v := req.id; end; res := json; end;