Prestashop : filtrer codes postaux pour les Dom Tom pays France

Prestashop
1.6

Difficulté
2/4

Durée
20′

Si vous livrez des produits dans les DOM TOM Prestashop n’effectue pas de contrôle de cohérence entre le code postal et le pays. Prestashop contrôle seulement le format du code postal défini dans les paramètres du pays 🙁  Donc un client qui commande des DOM DOM ( Martinique, Guadeloupe, Réunion…) va avoir France sélectionné par défaut dans le pays. Et comme il est Français, il ne pense pas forcément à chercher dans la liste des pays Martinique ou Guadeloupe 😉  Et là problème intervient, car dans les DOM TOM la majorité des produits et livraisons sont HT ! Là votre client va pas comprendre de payer de la TVA vers les DOM TOM, et vous risquez de le perdre !

Bon on a la solution pour vous ouf 🙂 Pour contrôler  la cohérence entre le code postal des DOM TOM et le pays sélectionné, un petit peu de code javascript et le tour est joué.

Quelques prérequis seront nécessaires pour la compréhension de ce tutoriel :

Rappel sur l’architecture d’un thème Prestashop 1.6

Les thèmes de Prestashop se situent dans le dossier « themes » situé à la racine du site. Exemple pour notre thème monTheme :

Etape 1 – modifier le fichier statesManagement.js

Nous devons modifier le fichier statesManagement.js un fichier dans le dossier js/tools/ de votre thème (sauvegardez le fichier avant toute modification) :

themes/monTheme/js/tools/statesManagement.js

Nous allons ajouter du code dans la partie $(document).ready(function(){ à la ligne 40 :

	$('#add_address').submit( function (event) {
		if(SecureDomtomFR()){
			if($('#uniform-id_country').next('p.inline-infos'))
				$('#uniform-id_country').next('p.inline-infos').remove();
			$('#uniform-id_country').css('border','1px solid #f13340').after('<p class="inline-infos required">** Le pays sélectionné ne correspond pas au code postal</p>');
			alert('Le pays sélectionné ne correspond pas au code postal');
			event.preventDefault();
		}else{
			return;
		}
	});
	$('#id_country').on('change', function () {
		if(SecureDomtomFR()){
			if($('#uniform-id_country').next('p.inline-infos'))
				$('#uniform-id_country').next('p.inline-infos').remove();
			$('#uniform-id_country').css('border','1px solid #f13340').after('<p class="inline-infos required">** Le pays sélectionné ne correspond pas au code postal</p>');
		}else{
			if($('#uniform-id_country').next('p.inline-infos'))
				$('#uniform-id_country').css('border','none').next('p.inline-infos').remove();
		}
	});
	validate_field = function(that){
		if ($(that).hasClass('is_required') || $(that).val().length)
		{
			if ($(that).attr('data-validate') == 'isPostCode')
			{
				var selector = '#id_country';
				if ($(that).attr('name') == 'postcode_invoice')
					selector += '_invoice';

				var id_country = $(selector + ' option:selected').val();

				if (typeof(countriesNeedZipCode[id_country]) != 'undefined' && typeof(countries[id_country]) != 'undefined')
					var result = window['validate_'+$(that).attr('data-validate')]($(that).val(), countriesNeedZipCode[id_country], countries[id_country]['iso_code']);

				var country = $('option[value=' + id_country + ']').text();

				if(country == "France"){
					if(($(that).val() >= 97100 && $(that).val() <= 97699) || ($(that).val() >= 98400 && $(that).val() <= 98899)){
						var result = false;
						if($('#uniform-id_country').next('p.inline-infos'))
							$('#uniform-id_country').next('p.inline-infos').remove();
						$('#uniform-id_country').css('border','1px solid #f13340').after('<p class="inline-infos required">** Le pays sélectionné ne correspond pas au code postal</p>');
					}else{
						if($('#uniform-id_country').next('p.inline-infos'))
							$('#uniform-id_country').css('border','none').next('p.inline-infos').remove();
					}
				}
			}
			else if($(that).attr('data-validate'))
				var result = window['validate_' + $(that).attr('data-validate')]($(that).val());

			if (result)
				$(that).parent().removeClass('form-error').addClass('form-ok');
			else
				$(that).parent().addClass('form-error').removeClass('form-ok');
		}
	}

Etape 2 – Ajouter à la fin du fichier statesManagement.js

Ajouter à la fin du fichier statesManagement.js le code suivant :

function SecureDomtomFR()
{
	var country = $('option[value=' + $('#id_country').val() + ']').text();
	var codePostalSaisi = $(".postcode #postcode").val();

	if((codePostalSaisi >= 97100 && codePostalSaisi <= 97699) || (codePostalSaisi >= 98400 && codePostalSaisi <= 98899)){
		if(country !== "France"){
			return false;
		}
		return true;
	}else {
		return false;
	}
}

Voilà maintenant une alerte s’affiche si le code postal correspond à un code postal DOM TOM et que le pays sélectionné est France. De plus le script empêche de valider le formulaire. Testé avec les versions de Prestashp 1.6.1 à 1.6.18

Télécharger le fichier statesManagement.js

Pour Prestashop 1.7 la solution est différente, voir le tuto pour 1.7