{"id":1792,"date":"2018-05-25T13:25:57","date_gmt":"2018-05-25T11:25:57","guid":{"rendered":"https:\/\/www.h-hennes.fr\/blog\/?p=1792"},"modified":"2020-05-26T07:56:56","modified_gmt":"2020-05-26T05:56:56","slug":"prestashop-1-7-utilisation-des-formfields","status":"publish","type":"post","link":"https:\/\/www.h-hennes.fr\/blog\/2018\/05\/25\/prestashop-1-7-utilisation-des-formfields\/","title":{"rendered":"Prestashop 1.7 : Utilisation des formfields"},"content":{"rendered":"<p>La version 1.7 rajoute une nouvelle notion pour g\u00e9rer les champs sur certains formulaires front ( Client et Adresse entre autre )<br \/>\nCeux-ci sont g\u00e9r\u00e9 via la classe <em>FormField<\/em> et leur affichage est g\u00e9r\u00e9 dans le template <em>themes\/themeName\/templates\/_partials\/form-fields.tpl<\/em><\/p>\n<p>Les m\u00e9thodes utiles pour g\u00e9rer ces champs sont les suivantes :<\/p>\n<ul>\n<li>setName: D\u00e9fini le nom du champ<\/li>\n<li>setType: D\u00e9fini le type du champ ( text\/checkbox .. ) voir liste ci-dessous<\/li>\n<li>setRequired : D\u00e9fini si le champ est obligatoire ou non<\/li>\n<li>setLabel : D\u00e9fini le label du champ<\/li>\n<li>setValue : D\u00e9fini la valeur du champ<\/li>\n<li>setAvailableValues : D\u00e9fini les valeurs disponibles pour le champ, pour les select entre autre<\/li>\n<li>addAvailableValue : Ajout une valeur disponible pour le champ<\/li>\n<li>setMaxLength: Longueur maximum du champ<\/li>\n<li>setConstraint : Ajoute une contrainte de validation au champ , les m\u00e9thodes appelables sont celles de la classe Validation ( ex isEmail )<\/li>\n<\/ul>\n<p>Pour l&rsquo;exemple j&rsquo;ai ajout\u00e9 des nouveaux champs au formulaire de cr\u00e9ation de compte client via le hook hookAdditionalCustomerFormFields<\/p>\n<p>Voici l&rsquo;ensemble des\u00a0 types de champs possibles :<\/p>\n<pre lang=\"php\" escaped=\"true\">return [\r\n    \/\/Champ texte standard\r\n    (new FormField)\r\n        -&gt;setName('professionnal_id')\r\n        -&gt;setType('text')\r\n        -&gt;setRequired(true) \/\/D\u00e9commenter pour rendre obligatoire\r\n        -&gt;setValue(\"TEST\")\r\n        -&gt;setMaxLength(\"10\")\r\n        -&gt;setLabel($this-&gt;l('Professionnal id')),\r\n    \/\/Champ File\r\n    (new FormField)\r\n        -&gt;setName('justificatif_upload')\r\n        -&gt;setType('file')\r\n        -&gt;setLabel($this-&gt;l('document ID')),\r\n    \/\/Select\r\n    (new FormField)\r\n        -&gt;setName('select_field')\r\n        -&gt;setType('select')\r\n        -&gt;setAvailableValues(array('key' =&gt; 'value 1', 'key2' =&gt; 'value2'))\r\n        -&gt;setLabel($this-&gt;l('Select type')),\r\n    \/\/countrySelect ( idem select mais rajoute une classe js js-country\r\n    (new FormField)\r\n        -&gt;setName('country_field')\r\n        -&gt;setType('countrySelect')\r\n        -&gt;setAvailableValues(['key' =&gt; 'value 1', 'key2' =&gt; 'value2'])\r\n        -&gt;setLabel($this-&gt;l('Country Select')),\r\n    \/\/Checkbox\r\n    (new FormField)\r\n        -&gt;setName('checkbox_field')\r\n        -&gt;setType('checkbox')\r\n        -&gt;setValue(1)\r\n        -&gt;setLabel($this-&gt;l('Checkbox type')),\r\n    \/\/radio-buttons\r\n    (new FormField)\r\n        -&gt;setName('radio_field')\r\n        -&gt;setType('radio-buttons')\r\n        -&gt;setAvailableValues(array('key' =&gt; 'value 1', 'key2' =&gt; 'value2'))\r\n        -&gt;setLabel($this-&gt;l('Radio buttons type')),\r\n    \/\/date\r\n    (new FormField)\r\n        -&gt;setName('date_field')\r\n        -&gt;setType('date')\r\n        -&gt;setLabel($this-&gt;l('Date')),\r\n    \/\/birthday\r\n    (new FormField)\r\n        -&gt;setName('birthday_field')\r\n        -&gt;setType('birthday')\r\n        -&gt;setLabel($this-&gt;l('birthday')),\r\n    \/\/password\r\n    (new FormField)\r\n        -&gt;setName('password_field')\r\n        -&gt;setType('password')\r\n        -&gt;setLabel($this-&gt;l('password')),\r\n    \/\/Champ email\r\n    (new FormField)\r\n        -&gt;setName('email_field')\r\n        -&gt;setType('email')\r\n        -&gt;setLabel($this-&gt;l('email type')),\r\n    \/\/Champ tel\r\n    (new FormField)\r\n        -&gt;setName('phone_field')\r\n        -&gt;setType('phone')\r\n        -&gt;setLabel($this-&gt;l('Phone type')),\r\n    \/\/Champ cach\u00e9\r\n    (new FormField)\r\n        -&gt;setName('hidden_field')\r\n        -&gt;setType('hidden')\r\n        -&gt;setValue('My hidden value')\r\n];<\/pre>\n<p>Et leur visualisation :<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-1793\" src=\"https:\/\/www.h-hennes.fr\/blog\/wp-content\/uploads\/2018\/05\/champs-formfields.jpg\" alt=\"Form fields prestashop\" width=\"523\" height=\"735\" srcset=\"https:\/\/www.h-hennes.fr\/blog\/wp-content\/uploads\/2018\/05\/champs-formfields.jpg 523w, https:\/\/www.h-hennes.fr\/blog\/wp-content\/uploads\/2018\/05\/champs-formfields-213x300.jpg 213w\" sizes=\"auto, (max-width: 523px) 100vw, 523px\" \/><\/p>\n","protected":false},"excerpt":{"rendered":"<p>La version 1.7 rajoute une nouvelle notion pour g\u00e9rer les champs sur certains formulaires front ( Client et Adresse entre autre ) Ceux-ci sont g\u00e9r\u00e9 via la classe FormField et leur affichage est g\u00e9r\u00e9 dans le template themes\/themeName\/templates\/_partials\/form-fields.tpl Les m\u00e9thodes utiles pour g\u00e9rer ces champs sont les suivantes : setName: D\u00e9fini le nom du champ [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"categories":[245],"tags":[401],"class_list":["post-1792","post","type-post","status-publish","format-standard","hentry","category-prestashop-2","tag-formulaires","prestashop-1-7","prestashop-1-7-8","prestashop-8-0"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.h-hennes.fr\/blog\/wp-json\/wp\/v2\/posts\/1792","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.h-hennes.fr\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.h-hennes.fr\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.h-hennes.fr\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.h-hennes.fr\/blog\/wp-json\/wp\/v2\/comments?post=1792"}],"version-history":[{"count":3,"href":"https:\/\/www.h-hennes.fr\/blog\/wp-json\/wp\/v2\/posts\/1792\/revisions"}],"predecessor-version":[{"id":2118,"href":"https:\/\/www.h-hennes.fr\/blog\/wp-json\/wp\/v2\/posts\/1792\/revisions\/2118"}],"wp:attachment":[{"href":"https:\/\/www.h-hennes.fr\/blog\/wp-json\/wp\/v2\/media?parent=1792"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.h-hennes.fr\/blog\/wp-json\/wp\/v2\/categories?post=1792"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.h-hennes.fr\/blog\/wp-json\/wp\/v2\/tags?post=1792"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}