Rechercher directement un vignoble : 
			<select class="itemName_vignes form-control" style="width:500px" name="itemName_vignes">
			</select>
			<script type="text/javascript">  
				$(document).ajaxStart(function() {
					$('#loading').addClass('loading');
					$('#loading-content').addClass('loading-content');
				});

				$(document).ajaxStop(function() {
					$('#loading').removeClass('loading');
					$('#loading-content').removeClass('loading-content');
				});
      
				$('.itemName_vignes').select2({
					language: "fr",
					placeholder: 'Rechercher un departement ou un vignoble',
					inputTooShort: function () {
						return "You must enter more characters...";
					},
					ajax: {
						url: 'https://www.valeursimmo.com/wp-content/themes/shapely/primmobox/autocomplete_vignes.php',
						dataType: 'json',
						delay: 100,
						data: function (params) {
							  term = params.term.replace("'", " ")
							  var query = {
								term:term,
								 _type:query,
								 q:term
							  }

							  // Query parameters will be ?search=[term]&type=public
							  return query;
							},
						processResults: function (data_vignes) {
							return {
								results: data_vignes
							};
						},
						cache: true
					},
					minimumInputLength: 2,
					minimumResultsForSearch: 20 // at least 20 results must be displayed
				});
				
				var $table = $('#available_data');
				$('.itemName_vignes').on('select2:select', function (e) {
					var post_data_vignes = e.params.data;
					e.preventDefault();
					$('#loader').removeClass('display-none')
					$.ajax({ 
						url: 'https://www.valeursimmo.com/wp-content/themes/shapely/primmobox/get_data_vignes.php',
						dataType: 'json',
						data: post_data_vignes,
                    	cache: true,
						success: function(response_vignes)
						{
							generateTable_vignes(response_vignes, $('#available_data'));
                    	}, 
						error: function(response_vignes)
						{
							generateTable_vignes(response_vignes, $('#available_data'));
						}
       				});
				});
				
				function paramBuilder(column){
					var list = {"":""};
					var data = this.getData().map(a => a[column]);

					data.forEach(function(item){
						if(typeof item !== "undefined"){
							list[item] = item;
						}
					});
					return list;
				}
				function delay (miliseconds) {
					return new Promise((resolve) => {
						window.setTimeout(() => {
							resolve();
						}, miliseconds);
					});
				}
				function partial(func /*, 0..n args */) {
					var args = Array.prototype.slice.call(arguments, 1);
					return function() {
						var allArguments = args.concat(Array.prototype.slice.call(arguments));
						return func.apply(this, allArguments);
					};
				}
								
				async function generateTable_vignes(response_vignes, table_vignes){
					$(".itemName_vignes").val(''); //set the value
					$(".itemName_vignes").html('');
					if (response_vignes == null ) {
						$('#header_data').empty();
						$('#header_data').append("<H2> Pas de resultats </H2>");
						$('#wrapper').empty();
						return false;
					}
					if (response_vignes.Error == 429) {
						$('#header_data').empty();
						$('#header_data').append("<H2> Limite de demande atteinte </H2>");
						$('#wrapper').empty();
						return false;
					}
					
					const arrayUniqueByKeyAnnee = [...new Map(response_vignes.map(item => [item['Annee'], item])).values()];
					const arrayUniqueByKeyChap = [...new Map(response_vignes.map(item => [item['Chapitre'], item])).values()];
					const arrayUniqueByKeyAge = [...new Map(response_vignes.map(item => [item['Age'], item])).values()];
					const arrayUniqueByKeyType = [...new Map(response_vignes.map(item => [item['Type'], item])).values()];
					
					
					$('#header_data').empty();
					$('#header_data').append("<H2>" + response_vignes[0].ville + " - " + response_vignes[0].noDep + "</H2>" + "Departement: " + response_vignes[0].dep + "<br> Region: " + response_vignes[0].region);
					$('#header_data').append("<br> Année: ");
					for(var i=0;i<arrayUniqueByKeyAnnee.length;i++){
						var newLink = document.createElement('a');
						newLink.innerHTML = arrayUniqueByKeyAnnee[i].Annee;
						newLink.onclick = function () {
							table_vignes.setHeaderFilterValue("Annee", this.innerHTML);
						};
						if(i > 0) {
							$('#header_data').append(" - ");
						}
						$('#header_data').append(newLink);	
					}
					
					$('#header_data').append("<br> Chapitre: ");
					for(var i=0;i<arrayUniqueByKeyChap.length;i++){
						var newLink = document.createElement('a');
						newLink.innerHTML = arrayUniqueByKeyChap[i].Chapitre;
						newLink.onclick = function () {
							table_vignes.setHeaderFilterValue("Chapitre", this.innerHTML);
						};
						if(i > 0) {
							$('#header_data').append(" - ");
						}
						$('#header_data').append(newLink);	
					}
					
					var printIcon = function(cell, formatterParams, onRendered){ //plain text value
						return "<i class='fa fa-calculator'></i>";
					};
					
					var table_vignes = new Tabulator("#wrapper", {
						data:response_vignes, //set initial table data
						layout:"fitColumns",
						layoutColumnsOnNewData:true,
						printAsHtml:true,
    					printHeader:"<h1>" + response_vignes[0].ville + " - " + response_vignes[0].noDep + "</H2>" + "Departement: " + response_vignes[0].dep + "<br> Region: " + response_vignes[0].region + "<h1>",
    					printFooter:"<h6 align='center'>Editions Callon Moullé - www.valeursimmo.com<img width='165' height='55' src='https://www.valeursimmo.com/wp-content/uploads/2022/11/logo_edcallon_72dpi-01-1-1-228x76.png' class='custom-logo logo' alt='Editions C2M'></h6>",
						printConfig:{
							 columnCalcs:false, //do not include column calcs in printed table
						 },
						pagination:"local",
    					paginationSize:20,
    					paginationSizeSelector:[10, 20, 50, 100],
    					paginationCounter:"rows",
						placeholderHeaderFilter:"Aucune données avec ces filtres",
						locale:true,
						langs:{
							"fr-fr":{ //French language definition
								"pagination":{
									 "counter":{
										 "showing": "",
										 "of": "sur",
										 "rows": "lignes",
										 "pages": "pages",
									 },
									"page_title":"Afficher la page",
									"first":"<<",
									"first_title":"Première Page",
									"last":">>",
									"last_title":"Dernière Page",
									"prev":"<",
									"prev_title":"Page Précédente",
									"next":">",
									"next_title":"Page Suivante",
									"page_size":"Nombre de lignes",
									"all":"Toute"
								},
							},
						},
						columns:[
							{title:"Annee", field:"Annee", sorter:"string", headerFilter:"list", headerFilterParams:{valuesLookup:true, clearable:false}, bottomCalc:"count"},
							{title:"Chapitre", field:"Chapitre", headerFilter:"list", sorter:"string", headerFilterParams:{valuesLookup:true, clearable:true}},
							{title:"Age", field:"Age", sorter:"string", headerFilter:"list", bottomCalc:"count", headerFilterParams:{valuesLookup:true, clearable:true}},
							{title:"Categorie", field:"Categorie", sorter:"string", headerFilter:"list", headerFilterParams:{valuesLookup:true, clearable:true}, bottomCalc:"count"},
							{title:"Taille", field:"Taille", sorter:"string", headerFilter:"list", headerFilterParams:{valuesLookup:true, clearable:false}, bottomCalc:"count"},
							{title:"Type", field:"Type", sorter:"string", headerFilter:"list", bottomCalc:"count", headerFilterParams:{valuesLookup:true, clearable:true}},
							{title:"Type de valeur", field:"Type_valeur", sorter:"string", headerFilter:"list", headerFilterParams:{valuesLookup:true, clearable:true}, bottomCalc:"count"},
							{//create column group
								title:"Prix",
								columns:[
									{title:"Moyenne", field:"Prix", bottomCalc:"count", hozAlign:"center", sorter:"number", mutator:function(value, data, type, mutatorParams, cell){
																												if (value != null) {
																													const formatter = new Intl.NumberFormat('fr-FR', {
																														style: 'currency',
																														currency: 'EUR',
																														minimumFractionDigits: 2,
																														// These options are needed to round to whole numbers if that's what you want.
																														//minimumFractionDigits: 0, // (this suffices for whole numbers, but will print 2500.10 as $2,500.1)
																														//maximumFractionDigits: 0, // (causes 2500.99 to be printed as $2,501)
																														});
																													return formatter.format(value) + '/' + data.Unit
																												}
																											}},		
								{title:"Mini", field:"Prix_Mini", bottomCalc:"count", hozAlign:"center", sorter:"number", mutator:function(value, data, type, mutatorParams, cell){
																												if (value != null) {
																													const formatter = new Intl.NumberFormat('fr-FR', {
																														style: 'currency',
																														currency: 'EUR',
																														minimumFractionDigits: 2,
																														// These options are needed to round to whole numbers if that's what you want.
																														//minimumFractionDigits: 0, // (this suffices for whole numbers, but will print 2500.10 as $2,500.1)
																														//maximumFractionDigits: 0, // (causes 2500.99 to be printed as $2,501)
																														});
																													return formatter.format(value) + '/' + data.Unit
																												}
																											}},
								{title:"Maxi", field:"Prix_Maxi", bottomCalc:"count", hozAlign:"center", sorter:"number", mutator:function(value, data, type, mutatorParams, cell){
																												if (value != null) {
																													const formatter = new Intl.NumberFormat('fr-FR', {
																														style: 'currency',
																														currency: 'EUR',
																														minimumFractionDigits: 2,
																														// These options are needed to round to whole numbers if that's what you want.
																														//minimumFractionDigits: 0, // (this suffices for whole numbers, but will print 2500.10 as $2,500.1)
																														//maximumFractionDigits: 0, // (causes 2500.99 to be printed as $2,501)
																														});
																													return formatter.format(value) + '/' + data.Unit
																												}
																											}},
								],
							},
						],
					});
					
					document.getElementById("print_button").style.display = "grid";
					document.getElementById("print_button").style.justifyContent = "end";
					const box = document.getElementById('print-table');
					box.replaceWith(box.cloneNode(true));
					//print button
					document.getElementById("print-table").addEventListener("click", function(){
					   table_vignes.print(false, true);
					});
					table_vignes.on("dataFiltered", function(){
						//filters - array of filters currently applied
						//rows - array of row components that pass the filters
						setTimeout(function() {
							// do something 1000ms later here.
							results = table_vignes.getCalcResults();	
							var data_count = results.bottom
							var data_arr;
							var non_empty = 0;
							for (var items in data_count) {
								if (data_count[items] == 0) {
									table_vignes.hideColumn(items); //hide the "name" column
									table_vignes.setHeaderFilterValue(items, "");
									table_vignes.redraw();
								} else if (data_count[items] > 0) {
									non_empty = non_empty + 1;
									table_vignes.showColumn(items); //show the "name" column
									table_vignes.redraw();
								}
							}
							if (non_empty == 0) {
								var filters = table_vignes.getHeaderFilters();
								if (typeof filters !== 'undefined' && filters.length > 0) {
									var lastElement = filters.pop();
									modal.style.display = "block";
									table_vignes.setHeaderFilterValue(lastElement.field, "");
								}
							}
						}, 100);					
					});
					
					table_vignes.on("cellMouseOver", function(e, cell){
						//e - the event object
						//cell - cell component
						var column = cell.getColumn().getField();
						if (column == "Prix_Mini" || column == "Prix_Maxi" || column == "Prix"){
							data = cell.getData("Prix")
							console.log(data.Frais);
							document.body.onmousemove=moveCursor;
							var curTxt=document.createElement('div');
							curTxt.id="cursorText";
							curTxt.innerHTML=data.Frais; /* Or whatever you want */
							document.body.appendChild(curTxt);

							var curTxtLen=[curTxt.offsetWidth,curTxt.offsetHeight];
							function moveCursor(e){
								if(!e){e=window.event;}
								curTxt.style.left=e.pageX+'px';
								curTxt.style.top=(e.pageY+20)+'px';
							}
						}
					});

					table_vignes.on("cellMouseOut", function(e, cell){
						//e - the event object
						//cell - cell component
						var column = cell.getColumn().getField();
						if (column == "Prix_Mini" || column == "Prix_Maxi" || column == "Prix"){
							const element = document.getElementById("cursorText");
							element.remove(); 
						}
					});

					table_vignes.on("tableBuilt", function(){
					const el_Annee = document.querySelector('[tabulator-field="Annee"]');
					const el_Chapitre = document.querySelector('[tabulator-field="Chapitre"]');
					const el_Age = document.querySelector('[tabulator-field="Age"]');
					const el_Type = document.querySelector('[tabulator-field="Type"]');
					const el_Taille = document.querySelector('[tabulator-field="Taille"]');
					const el_Cat = document.querySelector('[tabulator-field="Categorie"]');

					var newDiv = document.createElement('div');	
					var newLink = document.createElement('a');		
					newLink.innerHTML = "X";
					newLink.onclick = function () {
						table_vignes.setHeaderFilterValue("Chapitre", "");
					};
					newDiv.classList.add("filter_table");
					newDiv.append(newLink);	
					el_Chapitre.append(newDiv);

					newDiv = document.createElement('div');	
					newLink = document.createElement('a');	
					newLink.innerHTML = "X";
					newLink.onclick = function () {
						table_vignes.setHeaderFilterValue("Annee", "");
					};
					newDiv.classList.add("filter_table");
					newDiv.append(newLink);	
					el_Annee.append(newDiv);	
						
					newDiv = document.createElement('div');	
					newLink = document.createElement('a');		
					newLink.innerHTML = "X";
					newLink.onclick = function () {
						table_vignes.setHeaderFilterValue("Age", "");
					};
					newDiv.classList.add("filter_table");
					newDiv.append(newLink);	
					el_Age.append(newDiv);	

					newDiv = document.createElement('div');	
					newLink = document.createElement('a');		
					newLink.innerHTML = "X";
					newLink.onclick = function () {
						table_vignes.setHeaderFilterValue("Type", "");
					};
					newDiv.classList.add("filter_table");
					newDiv.append(newLink);	
					el_Type.append(newDiv);	

					newDiv = document.createElement('div');	
					newLink = document.createElement('a');		
					newLink.innerHTML = "X";
					newLink.onclick = function () {
						table_vignes.setHeaderFilterValue("Taille", "");
					};
					newDiv.classList.add("filter_table");
					newDiv.append(newLink);	
					el_Taille.append(newDiv);
						
					newDiv = document.createElement('div');	
					newLink = document.createElement('a');		
					newLink.innerHTML = "X";
					newLink.onclick = function () {
						table_vignes.setHeaderFilterValue("Categorie", "");
					};
					newDiv.classList.add("filter_table");
					newDiv.append(newLink);	
					el_Cat.append(newDiv);
						
						
					});
				}
				
			</script>