diff --git a/js/gamutable.es6.js b/js/gamutable.es6.js
index 7e25ce2..d4836cd 100644
--- a/js/gamutable.es6.js
+++ b/js/gamutable.es6.js
@@ -290,11 +290,21 @@ let monTableau = {
 				return `crayon ${this.crayons[name]}-${name}-${id}`;
 			}
 		},
-		tri(col, sens) {
+		tri(col, sens = false) {
 			const i = this.triProps.indexOf(col);
 			if (i !== -1) {
+				if (!sens) {
+					sens = 'asc';
+					if (this.triOrders[i] === 'asc') {
+						sens = 'desc';
+					}
+				}
+
 				this.triOrders[i] = sens;
 			} else {
+				if (!sens) {
+					sens = 'asc';
+				}
 				this.triProps.push(col);
 				this.triOrders.push(sens);
 			}
@@ -364,7 +374,7 @@ let monTableau = {
 				<tr>
 					<th v-for="(label,head,i) in header" :key="'head_'+i" :class="[head,classes[head]]">
 						<div>
-							<div class="label_tete_colonne" v-html="label"></div>
+							<div class="label_tete_colonne" v-html="label" @click.stop="tri(head)"></div>
 							<div class="iconeTri">
 								<svg class="tri_col" :class="ordreActif(head, 'asc')" width="1rem" height="1rem"  @click.stop="tri(head,'asc')">
 									<title></title>
diff --git a/js/gamutable.js b/js/gamutable.js
index d9436b7..ddbd89c 100644
--- a/js/gamutable.js
+++ b/js/gamutable.js
@@ -348,12 +348,25 @@ var monTableau = {
         return "crayon ".concat(this.crayons[name], "-").concat(name, "-").concat(id);
       }
     },
-    tri: function tri(col, sens) {
+    tri: function tri(col) {
+      var sens = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
       var i = this.triProps.indexOf(col);
 
       if (i !== -1) {
+        if (!sens) {
+          sens = 'asc';
+
+          if (this.triOrders[i] === 'asc') {
+            sens = 'desc';
+          }
+        }
+
         this.triOrders[i] = sens;
       } else {
+        if (!sens) {
+          sens = 'asc';
+        }
+
         this.triProps.push(col);
         this.triOrders.push(sens);
       }
@@ -405,7 +418,7 @@ var monTableau = {
       exporterCSV($csv, this.delimitercsv, this.namecsv);
     }
   },
-  template: "\n\t<div class=\"gamutable\">\n\t\t<div class=\"gamutable--surTable\">\n\t\t\t<select id=\"parPage\" v-model=\"parPageSelect\">\n\t\t\t\t<option v-for=\"v in tparpage\" :key=\"v\">{{v}}</option>\n\t\t\t</select>\n\t\t\t<input class=\"gamutable--rechercher\" type=\"text\" v-model=\"search\" placeholder=\"Rechercher\">\n\t\t\t<button class=\"btn gamutable--resetOrderBy\" type=\"button\" @click.stop=\"resetTri()\">R\xE9initialiser les tris des colonnes</button>\n\t\t\t<button class=\"btn gamutable--exportCSV\" type=\"button\" @click.stop=\"exportCSV()\"\n\t\t\t\ttitle=\"Exporter le tableau affich\xE9 en csv\"\n\t\t\t>\n\t\t\t\t<i class=\"fa fa-file-excel-o fas fa-file-csv\" aria-hidden=\"true\"></i>\n\t\t\t</button>\n\t\t\t<span v-show=\"chargement\" class=\"rouge\">\n\t\t\t\t<i class=\"fa fa-refresh fa-spin fa-fw rouge fas fa-sync fa-spin\"></i>\n\t\t\t\tMise \xE0 jour de la base de donn\xE9e\n\t\t\t</span>\n\t\t\t<span v-show=\"!chargement\" class=\"verte\">\n\t\t\t\t<i class=\"fa fa-check\"></i>\n\t\t\t\tBase de donn\xE9es synchronis\xE9e\n\t\t\t</span>\n\t\t</div>\n\t\t<table class=\"table table--zebra\">\n\t\t\t<thead>\n\t\t\t\t<tr>\n\t\t\t\t\t<th v-for=\"(label,head,i) in header\" :key=\"'head_'+i\" :class=\"[head,classes[head]]\">\n\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t<div class=\"label_tete_colonne\" v-html=\"label\"></div>\n\t\t\t\t\t\t\t<div class=\"iconeTri\">\n\t\t\t\t\t\t\t\t<svg class=\"tri_col\" :class=\"ordreActif(head, 'asc')\" width=\"1rem\" height=\"1rem\"  @click.stop=\"tri(head,'asc')\">\n\t\t\t\t\t\t\t\t\t<title></title>\n\t\t\t\t\t\t\t\t\t<use :xlink:href=\"url_sort_asc\" />\n\t\t\t\t\t\t\t\t</svg>\n\n\t\t\t\t\t\t\t\t<svg class=\"tri_col\" :class=\"ordreActif(head, 'desc')\" width=\"1rem\" height=\"1rem\"  @click.stop=\"tri(head,'desc')\">\n\t\t\t\t\t\t\t\t\t<title></title>\n\t\t\t\t\t\t\t\t\t<use :xlink:href=\"url_sort_desc\" />\n\t\t\t\t\t\t\t\t</svg>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</th>\n\t\t\t\t</tr>\n\t\t\t</thead>\n\t\t\t<tbody>\n\t\t\t\t<tr v-for=\"l in tableau\" :key=\"l.html.id\" :class=\"selectTr.indexOf(l.html.id) !== -1 ? 'select' : ''\" >\n\t\t\t\t\t<td v-for=\"(td,name, i) in l.html\" :key=\"'td_'+i\" :class=\"[afficher_crayons(name,l.html.id), name, classes[name], l.classes !== undefined ? l.classes[name] : '']\" v-html=\"td\" @click=\"selectLigne(l.html.id,name)\">\n\t\t\t\t\t</td>\n\t\t\t\t</tr>\n\t\t\t</tbody>\n\t\t</table>\n\t\t<div class=\"gamutable--sousTable\">\n\t\t\t<div class=\"gamutable-nbrMax\">{{tableau.length}} / {{table.length}} \xE9l\xE9ments</div>\n\t\t\t<div class=\"gamutable--pagination\">\n\t\t\t\t<div class=\"page-item\">\n\t\t\t\t\t<button type=\"button\" class=\"page-link\" v-if=\"page != 1\" @click=\"page=1\"> Start </button>\n\t\t\t\t\t<button type=\"button\" class=\"page-link\" v-if=\"page != 1\" @click=\"page--\"> Previous </button>\n\t\t\t\t</div>\n\t\t\t\t<div class=\"page-item\">\n\t\t\t\t\t<button type=\"button\" class=\"page-link\" v-for=\"pageNumber in pages.slice(page-1, page+5)\" @click=\"page = pageNumber\"> {{pageNumber}} </button>\n\t\t\t\t</div>\n\t\t\t\t<div class=\"page-item\">\n\t\t\t\t\t<button type=\"button\" @click=\"page++\" v-if=\"page < pages.length\" class=\"page-link\"> Next </button>\n\t\t\t\t\t<button type=\"button\" @click=\"page=pages.length\" v-if=\"page < pages.length\" class=\"page-link\"> Last </button>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t</div>"
+  template: "\n\t<div class=\"gamutable\">\n\t\t<div class=\"gamutable--surTable\">\n\t\t\t<select id=\"parPage\" v-model=\"parPageSelect\">\n\t\t\t\t<option v-for=\"v in tparpage\" :key=\"v\">{{v}}</option>\n\t\t\t</select>\n\t\t\t<input class=\"gamutable--rechercher\" type=\"text\" v-model=\"search\" placeholder=\"Rechercher\">\n\t\t\t<button class=\"btn gamutable--resetOrderBy\" type=\"button\" @click.stop=\"resetTri()\">R\xE9initialiser les tris des colonnes</button>\n\t\t\t<button class=\"btn gamutable--exportCSV\" type=\"button\" @click.stop=\"exportCSV()\"\n\t\t\t\ttitle=\"Exporter le tableau affich\xE9 en csv\"\n\t\t\t>\n\t\t\t\t<i class=\"fa fa-file-excel-o fas fa-file-csv\" aria-hidden=\"true\"></i>\n\t\t\t</button>\n\t\t\t<span v-show=\"chargement\" class=\"rouge\">\n\t\t\t\t<i class=\"fa fa-refresh fa-spin fa-fw rouge fas fa-sync fa-spin\"></i>\n\t\t\t\tMise \xE0 jour de la base de donn\xE9e\n\t\t\t</span>\n\t\t\t<span v-show=\"!chargement\" class=\"verte\">\n\t\t\t\t<i class=\"fa fa-check\"></i>\n\t\t\t\tBase de donn\xE9es synchronis\xE9e\n\t\t\t</span>\n\t\t</div>\n\t\t<table class=\"table table--zebra\">\n\t\t\t<thead>\n\t\t\t\t<tr>\n\t\t\t\t\t<th v-for=\"(label,head,i) in header\" :key=\"'head_'+i\" :class=\"[head,classes[head]]\">\n\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t<div class=\"label_tete_colonne\" v-html=\"label\" @click.stop=\"tri(head)\"></div>\n\t\t\t\t\t\t\t<div class=\"iconeTri\">\n\t\t\t\t\t\t\t\t<svg class=\"tri_col\" :class=\"ordreActif(head, 'asc')\" width=\"1rem\" height=\"1rem\"  @click.stop=\"tri(head,'asc')\">\n\t\t\t\t\t\t\t\t\t<title></title>\n\t\t\t\t\t\t\t\t\t<use :xlink:href=\"url_sort_asc\" />\n\t\t\t\t\t\t\t\t</svg>\n\n\t\t\t\t\t\t\t\t<svg class=\"tri_col\" :class=\"ordreActif(head, 'desc')\" width=\"1rem\" height=\"1rem\"  @click.stop=\"tri(head,'desc')\">\n\t\t\t\t\t\t\t\t\t<title></title>\n\t\t\t\t\t\t\t\t\t<use :xlink:href=\"url_sort_desc\" />\n\t\t\t\t\t\t\t\t</svg>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</th>\n\t\t\t\t</tr>\n\t\t\t</thead>\n\t\t\t<tbody>\n\t\t\t\t<tr v-for=\"l in tableau\" :key=\"l.html.id\" :class=\"selectTr.indexOf(l.html.id) !== -1 ? 'select' : ''\" >\n\t\t\t\t\t<td v-for=\"(td,name, i) in l.html\" :key=\"'td_'+i\" :class=\"[afficher_crayons(name,l.html.id), name, classes[name], l.classes !== undefined ? l.classes[name] : '']\" v-html=\"td\" @click=\"selectLigne(l.html.id,name)\">\n\t\t\t\t\t</td>\n\t\t\t\t</tr>\n\t\t\t</tbody>\n\t\t</table>\n\t\t<div class=\"gamutable--sousTable\">\n\t\t\t<div class=\"gamutable-nbrMax\">{{tableau.length}} / {{table.length}} \xE9l\xE9ments</div>\n\t\t\t<div class=\"gamutable--pagination\">\n\t\t\t\t<div class=\"page-item\">\n\t\t\t\t\t<button type=\"button\" class=\"page-link\" v-if=\"page != 1\" @click=\"page=1\"> Start </button>\n\t\t\t\t\t<button type=\"button\" class=\"page-link\" v-if=\"page != 1\" @click=\"page--\"> Previous </button>\n\t\t\t\t</div>\n\t\t\t\t<div class=\"page-item\">\n\t\t\t\t\t<button type=\"button\" class=\"page-link\" v-for=\"pageNumber in pages.slice(page-1, page+5)\" @click=\"page = pageNumber\"> {{pageNumber}} </button>\n\t\t\t\t</div>\n\t\t\t\t<div class=\"page-item\">\n\t\t\t\t\t<button type=\"button\" @click=\"page++\" v-if=\"page < pages.length\" class=\"page-link\"> Next </button>\n\t\t\t\t\t<button type=\"button\" @click=\"page=pages.length\" v-if=\"page < pages.length\" class=\"page-link\"> Last </button>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t</div>"
 };
 var app = new Vue({
   el: '#app',