Aujourd'hui je vais vous montrer comment créer un script client (jquery) ,avec l'utilisation de la méthode
ajax, et une partie back (PHP) dans des contrôleurs front office et back office.
Je vais traiter seulement, la démarche spécifique à la création d'un
module Prestashop,
Vous pourriez suivre la même démarche pour les contrôleurs natives admin et front de Prestashop
Ajax dans le Back office de Prestashop
Si vous avez un contrôleur admin créé, vous allez passer l'étape suivante sinon vous aurez à créer un contrôleur admin
Créer un appel ajax dans un fichier admin js
- Inclure le fichier js, il faut déjà le créer dans nommodule/views/admin/js/script.js, et pour appeler ce fichier dans la page admin de Prestashop ou onglet (tab en anglais), il faut utiliser la méthode hookDisplayBackOfficeHeader dans le fichier nommodule.php
exemple :
public function hookDisplayBackOfficeHeader(){
if (Tools::getValue('configure') != $this->name)
return;
$this->context->controller->addJquery(); // si aurait besoin de Jquery
$this->context->controller->addJS($this->_path.'views/admin/js/script.js');
}
et enregistrer le hook correspondant dans méthode
install du module dans le fichier
nommodule.php
$this->registerHook('displayBackOfficeHeader')
Dans le fichier script.js, mettre :
var id_product = $('input[name="id_product"]').val();
$.ajax({
type: "POST",
url: currentIndex + "&token=" + token,
dataType: 'json',
data: {
controller: 'AdminNomModuleNomController',
action: 'GetProductInformations',
ajax: true,
id_product: id_product,
},
success: function(result) {
if (result.status == 'ok'){
$('#id_product').html(result.productInformations.id_product);
$('#link').html(result.productInformations.link);
}
else
alert('error');
}
});
Créer un contrôlleur admin
Dans le dossier /nom_module/controllers/admin vous aurez à créer un fichier de nom
AdminNomModuleNomControllerController.php
Où NomModule est le nom du module et NomController est le nom du contrôleur admin
Et mettre
class AdminNomModuleNomControllerController extends ModuleAdminController{
public function __construct(){
parent::__construct();
$this->context = Context::getContext();
}
public function ajaxProcessGetProductInformations() {
if ((int) Tools::getValue("id_product") > 0) {
$id_product = (int) Tools::getValue("id_product");
$product = new Product((int) Tools::getValue("id_product"), false, $this->context->language->id, $this->context->shop->id);
$row = array();
$row['id_product'] = $id_product;
$product_informations = Product::getProductProperties($this->context->language->id, $row);
if ($product_informations)
$json = array(
'productInformations' => $product_informations);
'status' =>'ok'
);
else
$json = array(
'status' => 'error',
'message' => $this->l('Erreur de sauvegarde.')
);
die(Tools::jsonEncode($json));
break;
}
}
PS: il ne faut oublier de créer le lien de menu correspondant dans le fichier nommodule.php
par exemple utiliser ce code:
$tab = new Tab();
$languages = Language::getLanguages(false);
foreach ($languages as $language)
$tab->name[$language['id_lang']] = 'Le nom de mon onglet';
$tab->class_name = 'AdminMonModuleNomControleur'; //controller a creer correspondant au contenu de l'onglet
$tab->module = 'monmodule'; //nom du module
$tab->id_parent = Tab::getIdFromClassName('AdminOrders'); //mettre l'id de l'onglet parent de votre onglet
if (!$tab->add())
return false;
Ajax dans le Front office de Prestashop
Si vous avez créer un contrôlleur front, alors vous pouvez omettre l'étape suivante
Créer un contrôlleur front
Dans le dossier /nom_module/controllers/front vous aurez à créer un fichier de nom
default.php
class ModuleNameDefaultModuleFrontController extends ModuleFrontController
{
public function initContent(){
parent::initContent();
if (Tools::getValue('ajax')){
$id_product = (int) Tools::getValue("id_product");
$product_informations = Product::getProductProperties($this->context->language->id, $row);
if ($product_informations) $json = array('productInformations' => $product_informations);
else
$json = array(
'status' => 'error',
'message' => $this->l('Erreur de sauvegarde.')
);
die(Tools::jsonEncode($json));
}
}
Où Default est le nom du contrôleur.
Créer un appel ajax dans un le fichier tpl
Dans votre fichier tpl qui doit appeler l'ajax mettre
var id_product = $('input[name="id_product"]').val();
$.ajax({
type: "POST",
url: '
{$link->$this->context->getModuleLink('nommodule', 'default')}',
async: false,
cache: false,
data: "product_id="+id_product+"&ajax=1",
success: function(html){
$("#pricet").html(html.price);
$('#link').html(result.productInformations.link);
},
error: function() {alert("ERROR:");}
});
Comme ça je vous ai montré aujourd'hui comment développer avec ajax en Prestashop, pour les pages admin et les pages front.
N'hésitez pas à mettre vos questions en commentaires.
Si vous avez n'importe quel travail sur Prestashop, n'hésitez pas à envoyer un mail à tarek.fellah@gmail.com pour un devis gratuit dans les 24h.
