[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"theme-db":3,"$f8_9Hqj-xnIuFtqXDUvKnpbPw3tPtOjrftaBpFa5AFo4":22,"$fKnz2vuX4bZz1LbUTiuFsvSZ3e07l5_5fqNYp4Tzdhi8":60,"megamenu":141,"$f8dji6W9C-49ZDWXgyr8k6fHLWZ7VSYjRSiBcWeHlScg":197,"footer-db":211,"header-db":229},{"theme":4},{"colors":5,"typography":13,"ui":17,"defaultColorMode":21},{"primary":6,"secondary":7,"background":8,"foreground":9,"muted":10,"headerBg":11,"footerBg":12,"topBarBg":9,"topBarText":11},"#4F46E5","#0D9488","#F9FAFB","#111827","#6B7280","#ffffff","#020617",{"fontFamily":14,"fontUrl":15,"baseFontSize":16},"Inter, system-ui, sans-serif","https:\u002F\u002Ffonts.googleapis.com\u002Fcss2?family=Inter:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,400;0,700;0,800;0,900;1,400;1,700&display=swap","16px",{"borderRadius":18,"contentWidth":19,"shadow":20},"lg","7xl",true,"light",{"title":23,"slug":24,"metaDescription":25,"category":26,"tags":27,"difficulty":34,"psVersions":35,"content":38,"faq":39,"tldr":55,"readingTime":56,"generatedAt":57,"publishDate":57,"relatedArticles":58,"sourceCategory":59},"Créer un select dynamique dans un template Smarty PrestaShop","select-dynamique-template-smarty-prestashop","Apprenez à créer des listes déroulantes dynamiques dans vos templates Smarty PrestaShop : fournisseurs, catégories ou objets personnalisés avec requêtes SQL.","developpement",[28,29,30,31,32,33],"smarty","select dynamique","template tpl","ObjectModel","controller","formulaire","intermediaire",[36,37],"1.7","8.x","\u003Ch2>Introduction\u003C\u002Fh2>\n\u003Cp>Lorsque vous développez un module ou personnalisez un thème PrestaShop, vous aurez souvent besoin d'afficher une liste déroulante (\u003Ccode>\u003Cselect>\u003C\u002Fcode>) alimentée dynamiquement depuis la base de données. Que ce soit pour sélectionner un fournisseur, une catégorie personnalisée ou tout autre objet métier, le principe reste le même : récupérer les données via une méthode PHP, puis les injecter dans votre template Smarty.\u003C\u002Fp>\n\u003Cp>Cet article couvre les deux approches possibles — l'utilisation des classes natives PrestaShop et la création d'un ObjectModel personnalisé — avec des exemples concrets et les bonnes pratiques pour PrestaShop 8.x.\u003C\u002Fp>\n\u003Ch2>Approche 1 : Utiliser une classe native PrestaShop\u003C\u002Fh2>\n\u003Cp>PrestaShop fournit déjà des méthodes statiques pour récupérer les entités courantes. Pour les fournisseurs par exemple, la classe \u003Ccode>Supplier\u003C\u002Fcode> expose une méthode \u003Ccode>getSuppliers()\u003C\u002Fcode> prête à l'emploi.\u003C\u002Fp>\n\u003Ch3>Appel direct dans le template Smarty\u003C\u002Fh3>\n\u003Cp>La méthode la plus rapide consiste à appeler la fonction statique directement depuis le fichier \u003Ccode>.tpl\u003C\u002Fcode> :\u003C\u002Fp>\n\u003Cpre>\u003Ccode class=\"language-smarty\">\n{assign var=suppliers value=Supplier::getSuppliers()}\n<select name=\"id_supplier\" class=\"form-select\">\n    <option value=\"\">-- Sélectionnez un fournisseur --<\u002Foption>\n    {foreach from=$suppliers item=supplier}\n        <option value=\"{$supplier.id_supplier|intval}\">{$supplier.name|escape:'html':'UTF-8'}<\u002Foption>\n    {\u002Fforeach}\n<\u002Fselect>\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>\u003Cstrong>Points d'attention :\u003C\u002Fstrong>\u003C\u002Fp>\n\u003Cul>\n\u003Cli>Utilisez `|intval` sur les valeurs numériques et `|escape:'html':'UTF-8'` sur les chaînes pour prévenir les injections XSS.\u003C\u002Fli>\n\u003Cli>Ajoutez toujours une option vide par défaut pour guider l'utilisateur.\u003C\u002Fli>\n\u003Cli>La classe `form-select` est celle de Bootstrap 5, utilisé nativement dans PrestaShop 8.x. Pour les versions 1.7, utilisez `form-control`.\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Ch3>Passage via le controller (approche recommandée)\u003C\u002Fh3>\n\u003Cp>L'appel direct dans Smarty fonctionne, mais il mélange logique métier et présentation. La bonne pratique est d'assigner les données depuis votre controller :\u003C\u002Fp>\n\u003Cpre>\u003Ccode class=\"language-php\">\n\u002F\u002F Dans votre ModuleFrontController ou AdminController\npublic function initContent()\n{\n    parent::initContent();\n\n    $suppliers = Supplier::getSuppliers(\n        false,           \u002F\u002F $get_nb_products\n        $this->context->language->id,\n        true             \u002F\u002F $active uniquement\n    );\n\n    $this->context->smarty->assign([\n        'suppliers' => $suppliers,\n    ]);\n\n    $this->setTemplate('module:monmodule\u002Fviews\u002Ftemplates\u002Ffront\u002Fformulaire.tpl');\n}\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>Le template devient alors plus propre :\u003C\u002Fp>\n\u003Cpre>\u003Ccode class=\"language-smarty\">\n<select name=\"id_supplier\" class=\"form-select\">\n    <option value=\"\">-- Sélectionnez un fournisseur --<\u002Foption>\n    {foreach from=$suppliers item=supplier}\n        <option value=\"{$supplier.id_supplier|intval}\">{$supplier.name|escape:'html':'UTF-8'}<\u002Foption>\n    {\u002Fforeach}\n<\u002Fselect>\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>Cette séparation des responsabilités facilite la maintenance, les tests et le débogage.\u003C\u002Fp>\n\u003Ch2>Approche 2 : ObjectModel personnalisé avec select dynamique\u003C\u002Fh2>\n\u003Cp>Si vous travaillez avec une table personnalisée (par exemple des fournisseurs internes, des types de produits ou toute autre entité métier), vous devez créer votre propre méthode de récupération.\u003C\u002Fp>\n\u003Ch3>Créer la classe ObjectModel\u003C\u002Fh3>\n\u003Cp>Supposons une table \u003Ccode>ps_custom_entity\u003C\u002Fcode> avec les colonnes \u003Ccode>id_custom_entity\u003C\u002Fcode>, \u003Ccode>name\u003C\u002Fcode> et \u003Ccode>active\u003C\u002Fcode> :\u003C\u002Fp>\n\u003Cpre>\u003Ccode class=\"language-php\">\n\u002F\u002F modules\u002Fmonmodule\u002Fclasses\u002FCustomEntity.php\n\nclass CustomEntity extends ObjectModel\n{\n    public $id_custom_entity;\n    public $name;\n    public $active;\n\n    public static $definition = [\n        'table' => 'custom_entity',\n        'primary' => 'id_custom_entity',\n        'fields' => [\n            'name' => [\n                'type' => self::TYPE_STRING,\n                'validate' => 'isGenericName',\n                'required' => true,\n                'size' => 128,\n            ],\n            'active' => [\n                'type' => self::TYPE_BOOL,\n                'validate' => 'isBool',\n            ],\n        ],\n    ];\n\n    \u002F**\n     * Récupère toutes les entités actives\n     *\n     * @param bool $activeOnly Ne retourner que les entités actives\n     * @return array Liste des entités\n     *\u002F\n    public static function getAll(bool $activeOnly = true): array\n    {\n        $sql = new DbQuery();\n        $sql->select('id_custom_entity, name, active');\n        $sql->from('custom_entity');\n\n        if ($activeOnly) {\n            $sql->where('active = 1');\n        }\n\n        $sql->orderBy('name ASC');\n\n        return Db::getInstance(_PS_USE_SQL_SLAVE_)->executeS($sql) ?: [];\n    }\n}\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Ch3>Bonnes pratiques pour la requête SQL\u003C\u002Fh3>\n\u003Cp>Plusieurs points importants par rapport à une requête brute :\u003C\u002Fp>\n\u003Col>\n\u003Cli>**Utilisez `DbQuery`** plutôt qu'une concaténation de chaînes. Cette classe fournie par PrestaShop construit la requête de manière sécurisée et lisible.\u003C\u002Fli>\n\u003Cli>**Utilisez `_PS_USE_SQL_SLAVE_`** pour les lectures. Cela permet d'exploiter un éventuel serveur de réplication en lecture.\u003C\u002Fli>\n\u003Cli>**Sélectionnez uniquement les colonnes nécessaires** au lieu de `SELECT *`, pour de meilleures performances.\u003C\u002Fli>\n\u003Cli>**Retournez un tableau vide** en fallback (`?: []`) pour éviter les erreurs dans le template si la table est vide.\u003C\u002Fli>\n\u003Cli>**Triez les résultats** (`ORDER BY name ASC`) pour une meilleure expérience utilisateur dans le select.\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Ch3>Intégration dans le controller\u003C\u002Fh3>\n\u003Cpre>\u003Ccode class=\"language-php\">\n\u002F\u002F N'oubliez pas l'autoload\nrequire_once _PS_MODULE_DIR_ . 'monmodule\u002Fclasses\u002FCustomEntity.php';\n\n\u002F\u002F Dans votre controller\n$entities = CustomEntity::getAll(true);\n\n$this->context->smarty->assign([\n    'custom_entities' => $entities,\n]);\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Ch3>Template Smarty correspondant\u003C\u002Fh3>\n\u003Cpre>\u003Ccode class=\"language-smarty\">\n<div class=\"form-group\">\n    <label for=\"custom_entity\" class=\"form-label\">\n        {l s='Choisir une entité' mod='monmodule'}\n    <\u002Flabel>\n    <select name=\"id_custom_entity\" id=\"custom_entity\" class=\"form-select\" required>\n        <option value=\"\">{l s='-- Sélectionnez --' mod='monmodule'}<\u002Foption>\n        {foreach from=$custom_entities item=entity}\n            <option value=\"{$entity.id_custom_entity|intval}\"\n                {if isset($selected_entity) && $selected_entity == $entity.id_custom_entity}\n                    selected=\"selected\"\n                {\u002Fif}\n            >\n                {$entity.name|escape:'html':'UTF-8'}\n            <\u002Foption>\n        {\u002Fforeach}\n    <\u002Fselect>\n<\u002Fdiv>\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Ch2>Aller plus loin : select dépendant en cascade (AJAX)\u003C\u002Fh2>\n\u003Cp>Dans certains cas, vous avez besoin d'un deuxième select qui se met à jour en fonction du premier (par exemple : catégorie → sous-catégorie). Cela nécessite une requête AJAX.\u003C\u002Fp>\n\u003Ch3>Endpoint dans le controller du module\u003C\u002Fh3>\n\u003Cpre>\u003Ccode class=\"language-php\">\n\u002F\u002F modules\u002Fmonmodule\u002Fcontrollers\u002Ffront\u002Fajax.php\n\nclass MonModuleAjaxModuleFrontController extends ModuleFrontController\n{\n    public function initContent()\n    {\n        $parentId = (int) Tools::getValue('parent_id');\n\n        if (!$parentId) {\n            $this->ajaxResponse(['error' => 'ID parent manquant'], 400);\n            return;\n        }\n\n        $children = CustomEntity::getByParent($parentId);\n\n        $this->ajaxResponse(['items' => $children]);\n    }\n\n    private function ajaxResponse(array $data, int $code = 200): void\n    {\n        header('Content-Type: application\u002Fjson');\n        http_response_code($code);\n        echo json_encode($data);\n        exit;\n    }\n}\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Ch3>JavaScript côté front\u003C\u002Fh3>\n\u003Cpre>\u003Ccode class=\"language-javascript\">\ndocument.getElementById('parent_select').addEventListener('change', function () {\n    const parentId = this.value;\n    const childSelect = document.getElementById('child_select');\n\n    if (!parentId) {\n        childSelect.innerHTML = '<option value=\"\">--<\u002Foption>';\n        return;\n    }\n\n    fetch(`${prestashop.urls.base_url}module\u002Fmonmodule\u002Fajax?parent_id=${encodeURIComponent(parentId)}`, {\n        headers: { 'X-Requested-With': 'XMLHttpRequest' }\n    })\n    .then(response => response.json())\n    .then(data => {\n        childSelect.innerHTML = '<option value=\"\">-- Sélectionnez --<\u002Foption>';\n        data.items.forEach(item => {\n            const option = document.createElement('option');\n            option.value = item.id;\n            option.textContent = item.name;\n            childSelect.appendChild(option);\n        });\n    })\n    .catch(error => console.error('Erreur AJAX:', error));\n});\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Ch2>Récapitulatif des approches\u003C\u002Fh2>\n\u003Ctr>\u003Cth>Approche\u003C\u002Fth>\u003Cth>Quand l'utiliser\u003C\u002Fth>\u003Cth>Complexité\u003C\u002Fth>\u003C\u002Ftr>\n\u003Ctr>\u003Cth>Appel statique dans Smarty\u003C\u002Fth>\u003Cth>Prototypage rapide, entités natives PS\u003C\u002Fth>\u003Cth>Faible\u003C\u002Fth>\u003C\u002Ftr>\n\u003Ctr>\u003Cth>Passage via controller\u003C\u002Fth>\u003Cth>Production, modules publiés\u003C\u002Fth>\u003Cth>Moyenne\u003C\u002Fth>\u003C\u002Ftr>\n\u003Ctr>\u003Cth>ObjectModel + méthode custom\u003C\u002Fth>\u003Cth>Tables personnalisées\u003C\u002Fth>\u003Cth>Moyenne\u003C\u002Fth>\u003C\u002Ftr>\n\u003Ctr>\u003Cth>AJAX en cascade\u003C\u002Fth>\u003Cth>Selects dépendants les uns des autres\u003C\u002Fth>\u003Cth>Élevée\u003C\u002Fth>\u003C\u002Ftr>\n\u003Cp>Quelle que soit l'approche choisie, pensez toujours à échapper les données dans vos templates et à valider les entrées côté serveur lors du traitement du formulaire.\u003C\u002Fp>",[40,43,46,49,52],{"q":41,"a":42},"Comment appeler une fonction PHP directement dans un template Smarty PrestaShop ?","Utilisez la syntaxe `{assign var=maVariable value=MaClasse::maMethode()}` pour appeler une méthode statique et stocker le résultat dans une variable Smarty. Cependant, cette approche mélange logique et présentation. En production, préférez assigner la variable depuis votre controller avec `$this->context->smarty->assign()` pour une meilleure séparation des responsabilités.",{"q":44,"a":45},"Faut-il utiliser DbQuery ou une requête SQL brute dans PrestaShop ?","Privilégiez toujours `DbQuery` (le query builder de PrestaShop) plutôt que la concaténation de chaînes SQL. `DbQuery` gère automatiquement le préfixe des tables, produit un code plus lisible et réduit les risques d'injection SQL. Utilisez également `_PS_USE_SQL_SLAVE_` pour les requêtes en lecture afin d'exploiter la réplication si elle est configurée.",{"q":47,"a":48},"Comment créer un select dépendant (cascade) dans un module PrestaShop ?","Un select en cascade nécessite un appel AJAX. Créez un `ModuleFrontController` qui retourne les données en JSON selon le paramètre reçu, puis ajoutez un listener JavaScript `change` sur le premier select qui déclenche un `fetch()` vers votre endpoint. PrestaShop 8.x utilise les friendly URLs pour les modules : `module\u002Fmonmodule\u002Fajax?parent_id=X`.",{"q":50,"a":51},"Comment sécuriser un select dynamique contre les injections XSS dans Smarty ?","Appliquez systématiquement les modificateurs Smarty : `|intval` sur les identifiants numériques et `|escape:'html':'UTF-8'` sur les chaînes de caractères affichées. Côté serveur, validez toujours la valeur soumise avec `(int) Tools::getValue()` et vérifiez que l'ID correspond à un enregistrement existant avant tout traitement.",{"q":53,"a":54},"Quelle est la différence entre Supplier::getSuppliers() et une requête SQL directe pour alimenter un select ?","Les méthodes natives comme `Supplier::getSuppliers()` gèrent automatiquement le multilingue, le filtrage par boutique (multiboutique) et le cache. Une requête SQL directe est plus rapide mais ignore ces mécanismes. Utilisez les méthodes natives pour les entités standard de PrestaShop, et réservez les requêtes personnalisées à vos propres tables ou quand vous avez besoin de jointures spécifiques.","Pour créer un select dynamique dans un template Smarty PrestaShop, utilisez soit les méthodes statiques natives (comme Supplier::getSuppliers()), soit un ObjectModel personnalisé avec DbQuery, en assignant les données via le controller plutôt que par appel direct dans le .tpl.",5,"2026-03-21T16:54:03.000Z",[],"PrestaShop pour les développeurs",{"columns":61},[62,78,108,129],{"title":63,"links":64},"Plateforme",[65,69,72,75],{"label":66,"href":67,"external":68},"Offre Starter (2 500 €)","\u002Foffre-starter",false,{"label":70,"href":71,"external":68},"Devenir Ambassadeur","\u002Fambassadeur",{"label":73,"href":74,"external":68},"Modules PrestaShop","\u002Fmodules",{"label":76,"href":77,"external":20},"CodeMyShop.com","https:\u002F\u002Fcodemyshop.com",{"title":79,"links":80},"Le Synedre",[81,84,87,90,93,96,99,102,105],{"label":82,"href":83,"external":68},"L'histoire","\u002Fsynedre",{"label":85,"href":86,"external":68},"Constitution","\u002Fsynedre\u002Fconstitution",{"label":88,"href":89,"external":68},"L'équipe","\u002Fequipe",{"label":91,"href":92,"external":68},"Le réacteur en direct","\u002Freacteur",{"label":94,"href":95,"external":68},"Le Drill (entraînement)","\u002Fdrill",{"label":97,"href":98,"external":68},"Protocole de réunion","\u002Fsynedre\u002Freunion",{"label":100,"href":101,"external":68},"Les agents IA","\u002Fagents-ia",{"label":103,"href":104,"external":68},"La Conduite","\u002Fsynedre\u002Fconduite",{"label":106,"href":107,"external":68},"Charte plateforme","\u002Fsynedre\u002Fcharte",{"title":109,"links":110},"Ressources",[111,114,117,120,123,126],{"label":112,"href":113,"external":68},"Blog","\u002Fblog",{"label":115,"href":116,"external":68},"Academy","\u002Facademy",{"label":118,"href":119,"external":68},"Dictionnaire","\u002Fdictionnaire",{"label":121,"href":122,"external":68},"Expertise PrestaShop","\u002Fexpertise",{"label":124,"href":125,"external":68},"Flywheel","\u002Fflywheel",{"label":127,"href":128,"external":68},"Manifeste","\u002Fmanifeste",{"title":130,"links":131},"À propos",[132,135,138],{"label":133,"href":134,"external":68},"Alexandre Carette","\u002Fa-propos",{"label":136,"href":137,"external":68},"Dossier de presse","\u002Fpresse",{"label":139,"href":140,"external":68},"Contact","\u002Fcontact",{"items":142},[143,152,158,164,172,180,185,191],{"id":144,"type":145,"label":146,"href":122,"icon":148,"description":148,"badge":148,"groupTitle":148,"style":148,"gridColumns":148,"cssClass":148,"psCategoryId":148,"showPsChildren":68,"position":149,"children":150,"psChildren":151},41,"link",{"fr":147},"Expertise",null,0,[],[],{"id":153,"type":145,"label":154,"href":113,"icon":148,"description":148,"badge":148,"groupTitle":148,"style":148,"gridColumns":148,"cssClass":148,"psCategoryId":148,"showPsChildren":68,"position":155,"children":156,"psChildren":157},42,{"fr":112},1,[],[],{"id":159,"type":145,"label":160,"href":74,"icon":148,"description":148,"badge":148,"groupTitle":148,"style":148,"gridColumns":148,"cssClass":148,"psCategoryId":148,"showPsChildren":68,"position":161,"children":162,"psChildren":163},43,{"fr":73},2,[],[],{"id":165,"type":145,"label":166,"href":168,"icon":148,"description":148,"badge":148,"groupTitle":148,"style":148,"gridColumns":148,"cssClass":148,"psCategoryId":148,"showPsChildren":68,"position":169,"children":170,"psChildren":171},44,{"fr":167},"Outils IA","\u002Foutils-ia",3,[],[],{"id":173,"type":145,"label":174,"href":67,"icon":148,"description":148,"badge":148,"groupTitle":148,"style":176,"gridColumns":148,"cssClass":148,"psCategoryId":148,"showPsChildren":68,"position":177,"children":178,"psChildren":179},45,{"fr":175},"Offre Starter ✨",{"highlight":20},4,[],[],{"id":181,"type":145,"label":182,"href":116,"icon":148,"description":148,"badge":148,"groupTitle":148,"style":148,"gridColumns":148,"cssClass":148,"psCategoryId":148,"showPsChildren":68,"position":56,"children":183,"psChildren":184},46,{"fr":115},[],[],{"id":186,"type":145,"label":187,"href":134,"icon":148,"description":148,"badge":148,"groupTitle":148,"style":148,"gridColumns":148,"cssClass":148,"psCategoryId":148,"showPsChildren":68,"position":188,"children":189,"psChildren":190},47,{"fr":130},6,[],[],{"id":192,"type":145,"label":193,"href":140,"icon":148,"description":148,"badge":148,"groupTitle":148,"style":148,"gridColumns":148,"cssClass":148,"psCategoryId":148,"showPsChildren":68,"position":194,"children":195,"psChildren":196},48,{"fr":139},7,[],[],{"academy":198,"blog":199,"expertise":210},[],[200,204,207],{"title":201,"url":202,"score":155,"type":203},"PrestaShop headless avec Nuxt 3 : pourquoi séparer back et front","\u002Fblog\u002Fprestashop\u002Farchitecture\u002Fprestashop-headless-nuxt-separation-front-back","blog",{"title":205,"url":206,"score":155,"type":203},"PrestaShop headless : Nuxt 3, pas Next.js — le choix souverain","\u002Fblog\u002Fprestashop\u002Farchitecture\u002Fprestashop-headless-nuxt-nextjs-souverainete",{"title":208,"url":209,"score":155,"type":203},"Sylius rachète PrestaShop : ce que ça change pour vous","\u002Fblog\u002Fprestashop\u002Farchitecture\u002Fsylius-rachat-prestashop-headless-souverainete",[],{"footer":212},{"theme":213,"description":148,"hours":148,"logo":214,"contact":217,"social":218,"bottomBar":228},"dark",{"src":215,"href":216,"alt":133},"\u002Flogo-ac.svg","\u002F",{"email":148,"phone":148,"address":148,"cta":148},[219,222,225],{"platform":220,"href":221,"label":220},"linkedin","https:\u002F\u002Fwww.linkedin.com\u002Fin\u002Falexandre-carette\u002F",{"platform":223,"href":224,"label":223},"malt","https:\u002F\u002Fwww.malt.fr\u002Fprofile\u002Falexandrecarette",{"platform":226,"href":227,"label":226},"github","https:\u002F\u002Fgithub.com\u002Fprest4cafe",{"copyright":148},{"header":230},{"logo":231,"topBar":234,"contactEmail":237,"features":238,"navBar":148},{"src":215,"alt":232,"text":133,"href":216,"class":233},"Alexandre Carette — Architecte E-commerce Souverain","h-10 w-10",{"message":148,"showLanguages":68,"align":235,"languages":236},"left",[],"contact@alexandrecarette.fr",{"showSearch":68,"showWishlist":68,"showLogin":20,"showContact":68,"showCart":68,"stickyHeader":20,"headerLayout":239},"inline"]