Accès
Pour insérer un objet Autosuggestion, il faut, au choix :
- Choisir l'option Objets Adélia Web Studio/Autosuggestion du menu Insertion de la fenêtre Macromedia Dreamweaver®.
- Effectuer un clic sur le bouton correspondant
dans la barre d'insertion des objets Adélia de Dreamweaver®.
Pour une meilleure compréhension des fonctionnalités graphiques de cet objet, il est conseillé d'étudier les exemples fournis dans la base de connaissances Adélia (dans le domaine EXEMPLE_WEB de l'environnement BDCADEL).
Cette boîte de dialogue permet de définir les différents attributs de l'objet Autosuggestion.
Général
Nom
Mot directeur Adélia de la zone.
Mode d'utilisation
Mode d'association de la liste de résultat associée.
Avec le mode Liste déroulante, la liste associée est visuellement une liste mono-colonne. Cette liste n'est pas maquettable directement dans Dreamweaver (à la manière de l'objet LISTE DEROULANTE). Au niveau L4G, l'objet Autosuggestion fournit les propriétés VALEUR, VALEUR_COURANTE et LISTE. Il est manipulable comme un objet LISTE DEROULANTE.
Avec le mode Table liste, l'objet est associé à un objet TABLE LISTE. Le rendu des résultats est lié au rendu de cet objet (table avec en-tête, rendu des cellules en fonction de la nature des objets Adélia constituant les colonnes de la liste, etc.). Visuellement, la liste de résultats affichée peut être multi-colonne.
Au niveau L4G, l'objet Autosuggestion ne fournit que la propriété VALEUR. La propriété LISTE n'existe pas dans ce mode, car l'objet s'appuie sur la liste de l'objet TABLE LISTE associé. Pour savoir quelles sont les valeurs associées à la propriété VALEUR, l'utilisateur doit choisir une colonne "valeur" parmi les colonnes constituant l'objet TABLE LISTE.
Valeurs possibles :
- Liste déroulante,
- Table liste.
Rendu de la liste associée
Permet d'afficher dans le maquetteur (en mode Création) la représentation graphique de la liste de résultats associée.
Case cochée |
Si l'objet est en mode Liste déroulante, alors la liste de résultats est dessinée en dessous du champ de saisie, dans la fenêtre du mode Création de Dreamweaver®. Si l'objet est en mode Table liste, alors l'objet Table Liste associé est dessiné dans la fenêtre du mode Création de Dreamweaver®. |
Type Adélia de la valeur
Type Adélia de la zone.
Si l'objet ne gère pas de libellé, la seule valeur possible est Alphanumérique.
Si l'objet gère un libellé, les valeurs possibles sont :
Alphanumérique,
Binaire court,
Binaire long,
Binaire long 64,
Condensé,
Date,
Etendu,
Time,
Timestamp.
Type Adélia du libellé
Type Adélia de la zone si l'objet gère un libellé. La seule valeur possible est Alphanumérique.
Critère
Critère de calcul des éléments de la liste de résultats.
Valeurs possibles :
- commence par : un élément est présent dans la liste de résultats si le texte saisi par l'utilisateur est un préfixe de la valeur de celui-ci.
- finit par : un élément est présent dans la liste de résultats si le texte saisi par l'utilisateur est un suffixe de la valeur de celui-ci.
- contient : un élément est présent dans la liste de valeurs si le texte saisi par l'utilisateur est une sous-chaîne de la valeur de celui-ci.
Gérer un libellé
Case cochée |
L'objet gère un libellé. La liste de résultats contient des couples valeur/libellé. Le critère de sélection s'applique aux libellés des éléments de la liste. De plus, ce qui est saisi par l'utilisateur dans le champ de saisie doit être un libellé. |
Case non cochée |
L'objet ne gère pas de libellé. La liste de résultats contient des valeurs. Le critère de sélection s'applique aux valeurs des éléments de la liste. De plus, ce qui est saisi par l'utilisateur dans le champ de saisie doit être une valeur. |
Table liste associée
Liste des objets TABLE LISTE présents dans la maquette et compatibles avec l'objet Autosuggestion.
Sont exclus les objets :
- ayant un pas (pagination dynamique),
- ayant un nombre de "lignes par élément" supérieur à 1,
- n'ayant aucune colonne dont le type Adélia est compatible avec les types Adélia supportés par l'objet Autosuggestion.
Lorsqu'un objet TABLE LISTE est sélectionné, il est possible de choisir parmi les objets colonne de la liste, la colonne "valeur" et la colonne "libellé".
Dans l'inspecteur de propriétés de l'objet Autosuggestion, le bouton 
permet de rafraîchir la liste des colonnes de l'objet TABLE LISTE selectionné si les caractéristiques de celles-ci ont été modifiées.
Valeur dans cas limite
Lorsque l'objet gère un libellé, valeur à affecter à sa propriété VALEUR lorsque :
- la liste de résultats est vide,
- aucun élément n'est sélectionné dans la liste de résultats,
- le champ de saisie est vide,
- l'utilisateur a saisi une valeur dans le champ de saisie avant l'apparition de la liste de résultats.
Valeurs possibles :
- *LOVAL,
- *HIVAL,
- *BLANK,
- Une valeur utilisateur.
Taille du cache
Nombre maximum d'éléments de la liste de résultats pouvant être stockés dans le cache de l'objet. Tant que le nombre de lignes reçues est inférieur au maximum autorisé, alors l'objet stocke le résultat de la requête dans son cache. Si la taille d'une nouvelle requête augmentée de celles déjà stockées est supérieure au maximum autorisé, alors l'objet ne stocke pas le résultat de cette requête dans son cache.
La valeur 0 désactive la gestion du cache.
Styles
Actif
Case cochée |
Activation de l'objet Autosuggestion. |
Case non cochée |
Désactivation de l'objet Autosuggestion. Il est impossible de saisir du texte dans le champ de saisie. |
Lecture seule
Case cochée |
Le champ de saisie est en mode "lecture seule" et l'utilisateur ne peut pas y saisir de valeur. |
Obligatoire
Case cochée |
Permet de définir une zone obligatoire. Si le formulaire est soumis et qu'aucune valeur n'a été saisie, une erreur est détectée. |
Surlignage du premier élément
Case cochée |
Surligne le premier élément de la liste de résultats lorsque celle-ci est affichée. Par défaut, l'élément surligné a une couleur de fond et une couleur de texte prédéfinies (valeurs définies dans la classe CSS AWSAutosuggestHighlight). Il est possible de spécifier une autre classe CSS. |
Proposer saisie
Case cochée |
Affiche, dans le champ de saisie, le premier élément de la liste de résultats en sélectionnant la sous-chaîne de texte qui reste à saisir. Cette fonctionnalité n'est autorisée que si le surlignage du premier élément est activé. |
Sensible à la casse
Case cochée |
Le critère de sélection est sensible à la casse, c'est-à-dire que l'on distingue les majuscules des minuscules dans le calcul de la liste de résultats. |
Sensible aux accents
Case cochée |
Le critère de sélection est sensible aux accents, c'est-à-dire que l'on distingue les caractères accentués des caractères non accentués dans le calcul de la liste de résultats. |
Remarque sur l'internationalisation : Lorsque l'objet n'est pas sensible aux accents, il convertit les caractères accentués en caractères non accentués équivalents. Cette équivalence est supportée pour les langues française (code langue ISO-639 'fr'), italienne (code langue ISO-639 'it'), espagnole (code langue ISO-639 'es') et allemande (code langue ISO-639 'de').
Pour le support d'une autre langue, il est nécessaire de décrire cette équivalence dans un fichier nommé 'AWSTagLibAutosuggestBundle_XX.properties' où XX représente le code langue ISO-639. Ce fichier doit être placé dans le sous-répertoire AWSResources du répertoire contenant l'application Web. De plus, il doit être encodé au format ISO-8859-1 (ou Latin-1).
Chaque correspondance entre un caractère et les caractères accentués associés doit être définie comme suit (une correspondance par ligne dans le fichier) :
DIACRITIC_CAR_<INCR>=<CHAR_WITHOUT_ACCENT>-<CHAR_WITH_ACCENT_1>-<CHAR_WITH_ACCENT_2>-....-<CHAR_WITH_ACCENT_N>
Où :
- <INCR> est un numéro commençant à 1 et à incrémenter pour chaque ligne,
- <CHAR_WITHOUT_ACCENT> est le caractère sans accent en minuscule,
- <CHAR_WITH_ACCENT_N> sont les caractères accentués en minuscule en correspondance avec <CHAR_WITHOUT_ACCENT>.
Si un caractère n'existe pas dans la table d'encodage ISO-8859-1 alors il doit être écrit en utilisant sa valeur dans la table d'encodage Unicode comme suit :
'\uXXXX'
où XXXX correspond à la valeur hexadécimale du caractère dans la table d'encodage Unicode (Exemple : le caractère € est converti en '\u20AC').
Sélection forcée
Case cochée |
Force l'utilisateur à sélectionner un élément dans la liste de résultats. Si l'utilisateur saisit une chaîne qui ne correspond à aucune valeur, alors le champ de saisie est vidé à la perte de focus de celui-ci. |
Nb de caractères minimum
Case cochée |
Nombre minimum de caractères saisis par l'utilisateur à partir duquel l'objet déclenche une requête de demande de valeurs résultat. |
Nb maximum de résultats
Case cochée |
Nombre maximum de valeurs résultat retournées. Cette propriété permet de limiter le nombre de résultats si celui-ci est trop grand. Si ce nombre vaut "Tous", on renvoie toutes les valeurs possibles. Si ce nombre est positif, alors visuellement un texte indiquant qu'il existe d'autres valeurs est affiché au bas de la liste de résultats. Un clic sur ce texte permet d'afficher les autres résultats en déclenchant un événement ONSUGGEST. Ce texte peut être internationalisé. Pour cela, il faut définir une valeur aux clés MORE_ELT_SHORT_TEXT et MORE_ELT_TOOLTIP dans un fichier nommé "AWSTagLibAutosuggestBundle_XX.properties".
Cette propriété n'est supportée qu'en mode automatique du calcul de la liste de résultats. En mode manuel, c'est à l'utilisateur que revient la charge de limiter le nombre d'éléments présents dans la liste de résultats en fonction de cette valeur. De plus, il doit gérer le clic sur le texte indiquant qu'il existe d'autres valeurs via les propriétés AUTRES_ELEMENTS et CLE_DERNIER_ELEMENT. |
Styles de la liste
Largeur
Largeur pour l'affichage de la liste de résultats. Cette largeur doit être définie par une valeur suivie d'une unité (exemple : "120px", "200em").
Hauteur
Hauteur maximum pour l'affichage de la liste de résultats. Cette hauteur doit être définie par une valeur suivie d'une unité (par exemple : "120px", "200em"). Lorsque la hauteur réelle de la liste est supérieure à sa hauteur maximum, alors un ascenseur vertical apparaît à droite des éléments de la liste.
Effet visuel
Définit l'effet visuel d'apparition de la liste de résultats. Cette propriété n'est supportée que par le navigateur Internet Explorer.
Valeurs possibles :
Aucun |
La liste s'affiche instantanément. |
Fade in |
La liste s'affiche progressivement avec un effet de fondu. |
Pixelate |
La liste s'affiche progressivement avec un effet de pixellisation. |
Dissolve |
La liste s'affiche progressivement avec un effet de dissolution. |
Wipe down |
La liste s'affiche progressivement avec un effet de volet de haut en bas. |
Wipe right |
La liste s'affiche progressivement avec un effet de volet de gauche à droite. |
Ombre
Case cochée |
Définit une ombre autour de la liste de résultats. |
Classe CSS de la liste
Définit une classe de style CSS pour la liste de résultats.
Classe CSS de surlignage
Définit une classe de style CSS utilisée pour différencier l'élément à sélectionner dans la liste de résultats.
Classe CSS des éléments
Définit une classe de style CSS pour l'affichage de chaque élément de la liste de résultats.
Cette classe n'est utilisée que lorsque l'objet Autosuggestion est en mode Liste déroulante.
En-tête
Définit un libellé d'en-tête dans la liste de résultats. Cet en-tête peut être soit du texte, soit un fragment HTML. Il est affiché au-dessus du premier élément de la liste de résultats.
Pied de page
Définit un libellé de pied de page dans la liste de résultats. Ce pied de page peut être soit du texte, soit un fragment HTML. Il est affiché au bas de la liste de résultats.
Menu contextuel
Nom du menu
Permet de lier un menu contextuel à cet objet. Il est possible de lier plusieurs objets Adélia à un même objet Menu (la propriété L4G OBJ_ORIGINE de l'objet Menu, utilisée dans un traitant d'événements d'un menu ou d'un item de menu, permet de savoir sur quel objet Adélia l'utilisateur a ouvert le menu).
Evénement
Définit l'événement Javascript qui déclenchera l'ouverture du menu contextuel associé.
Valeurs possibles :
onclick |
Déclenche l'ouverture du menu lorsque l'utilisateur clique sur le contrôle. |
oncontextmenu |
Déclenche l'ouverture du menu lorsque l'utilisateur clique sur le contrôle avec le bouton droit de la souris. Par défaut, sur cet événement, le navigateur ouvre un menu système. Pour afficher ce menu à la place du menu Adélia, appuyez sur la touche Ctrl lors du clic bouton droit. |
onmousedown |
Déclenche l'ouverture du menu lorsque l'utilisateur enfonce le bouton gauche de la souris sur le contrôle. |
onmouseover |
Déclenche l'ouverture du menu lorsque l'utilisateur survole le contrôle avec le curseur de la souris. |
onmouseup |
Déclenche l'ouverture du menu lorsque l'utilisateur relâche le bouton gauche de la souris sur le contrôle. |
Remarque : Pour une meilleure ergonomie, lorsque l'événement Javascript d'ouverture du menu est basé sur un clic de souris (oncontextmenu, onclick, onmousedown, onmouseup), la propriété "Fermeture sur clic page" définie au maquettage de l'objet Menu doit être activée.
Lorsque l'événement Javascript est basé sur un mouvement de la souris (onmouseover), cette propriété doit être désactivée.
Evénements
OnSuggest
Case cochée |
Un traitant d'événement Adélia est affecté en réaction à la demande de calcul de la liste de résultats. Dans le traitant associé, les propriétés VALEUR et VALEUR_LIBELLE (suivant si l'objet gère un libellé) sont mises à jour. Le code L4G associé au traitant d'événement n'est exécuté qui si la propriété MODE_AUTOMATIQUE est à *FAUX. Attention : cet événement est de type AJAX exclusivement. |
Remarque : l'ajout d'un traitant d'événement OnSuggest sur un objet Autosuggestion nommé ASG_1 crée, dans le source L4G, lors de la sauvegarde de la page HTML, un bloc événement ASG_1:ONSUGGEST imbriqué dans le bloc objet ASG_1, lui-même imbriqué dans le bloc GESTION EVENEMENT.
OnSelect
Case cochée |
Un traitant d'événement Adélia est affecté en réaction à la sélection par l'utilisateur d'un élément dans la liste de résultats. Le traitant d'événement peut être soit un événement Adélia (validant le formulaire ou non), soit une expression Javascript. Dans le traitant associé, les propriétés VALEUR et VALEUR_LIBELLE (suivant si l'objet gère un libellé) sont mises à jour. |
Il est possible de paramétrer les événements :
Type
Défini la nature de l'événement.
Valeurs possibles :
Evénement |
Définit un événement avec validation. |
Evt sans validation |
Définit un événement sans qu'aucune vérification de la validité des zones de la page HTML ne soit effectuée. Les variables Adélia liées aux objets graphiques de la page ne sont pas mises à jour. |
Evt de téléchargement |
Définit un événement avec validation qui en plus, déclenche le téléchargement des fichiers sélectionnés par l'intermédiaire d'un objet Téléchargement. |
AJAX
Case cochée |
Définit un événement AJAX. |
Cliquer ici pour plus d'informations sur les traitants d'événements Adélia.
Il est possible de paramétrer un événement Ajax :
Asynchrone
Case cochée |
Définit un événement AJAX asynchrone. Un événement asynchrone ne fige pas l'interface utilisateur. Celle-ci reste réactive pendant le traitement de l'événement sur le serveur d'application Web. |
Comportement
Définit la stratégie à suivre lors de demandes concurrentes d'exécution de cet événement.
Valeurs possibles :
Evt différent |
Fait comme s'il s'agissait de deux événements différents et s'appuie sur la règle définie pour les requêtes différentes (voir paramètre SIMULTANEOUS_DIFFERENT_REQUESTS_RULE dans Paramètres du fichier AWSAjax.properties). |
Evt précédent annulé |
Annule l'événement précédent (annule physiquement la connexion HTTP si l'événement précédent est en cours d'exécution ou le supprime de la file d'attente s'il est en attente d'exécution). |
Evt annulé |
Le second événement n'est pas pris en compte, quel que soit l'état du premier événement (en cours ou en attente). |
Horloge
Définit le temps d'attente entre deux exécutions de cet événement. La saisie d'une valeur dans ce champ signifie que l'événement est cyclique : il est automatiquement répété indéfiniment dès sa première exécution.
Les valeurs possibles pour les unités sont :
- Millisec. pour la milli-seconde,
- Seconde,
- Minute,
- Heure.
Cette valeur ne doit pas être supérieure à la durée de vie d'une session HTTP (définie dans le fichier web.xml).
Priorité
Définit la priorité de l'événement lorsqu'il est placé dans la file d'attente. Cette priorité définit l'ordre d'exécution de chaque événement dans la file d'attente.
Cette valeur doit être comprise entre REQUEST_MIN_PRIORITY et REQUEST_MAX_PRIORITY.
Si aucune valeur n'est saisie dans ce champ, la priorité vaut REQUEST_DEFAULT_PRIORITY (voir ces valeurs dans Paramètres du fichier AWSAjax.properties).
Invisible
Rend invisible l'indicateur de progression lorsque cet événement est exécuté.
Ce paramètre n'est pris en compte que si PROGRESS_INDICATOR_SHOW_ALL_STARTED_REQUEST vaut "N".