FormulaireCapture » Historique » Révision 4
Révision 3 (Jonathan Schaeffer, 20/07/2015 14:15) → Révision 4/5 (Jonathan Schaeffer, 20/07/2015 14:16)
h1. Formulaire de capture Cette documentation décrit les technologies et techniques employées pour construire le formulaire de captures h2. Sélection des champs en fonction des choix précédents Le formulaire de capture commence par une série de choix proposés à l'utilisateur. Chaque réponse conditionne les choix suivants. Pour plus de fluidité, on reste toujours sur une seule page web et on veut un minimum de clics. h3. Principe On fait de l'unobstrusive javascript. Chaque événement de changement sur un objet de sélection déclenche une requête au serveur pour calculer la liste des choix dans l'élément suivant. Un élément du HTML a un identifiant (par exemple @capture_theme_id option@) qui est utilisé par un code javascript pour peupler les choix listés dans cet élément. Le serveur route cette requête auprès du contrôleur qui déclenche le calcul d'une vue javascript qui sera a h3. Mise en oeuvre Les fonctions AJAX sont écrites dans le fichier source:/app/assets/javascripts/captures.js.coffee Un changement @.on 'change'@ sur un élément déclenche une requête @GET@ au format javascript (@.js@) avec l'option @theme_id@ positionnée à la valeur sélectionnée. Dans le controleur de capture source:/app/controllers/captures_controller.rb source:/app/controller/captures_controller.rb la fonction update_points permet de donner un retour aux requêtes JS. Cette fonction prépare une liste de points et déclenche la vue liée source:/app/views/captures/update_point.js.coffee source:/app/view/captures/update_point.js.coffee Dans cette vue, le code remplace toutes les options de l'élément select @#capture_point_id@ par les noms des objets que lui a transmis le controlleur. h2. Responsive : rendu du formulaire pour des supports smartphone/tablette