Depuis que les navigateurs intègrent des onglets, on a tous l’habitude d’utiliser la touche tabulation de notre clavier pour naviguer entre les onglets.
Pourquoi ne pas avoir la même fonctionnalité dans un formulaire K2 ?
C’est une fonctionnalité assez facile à implémenter, via le code Javascript suivant :
function checkTabPress(e) {
"use strict";
e = e || event;
var activeElement;
if (e.keyCode == 9) {
// tabulation pressed
if($(".tab.selected").closest('li').nextAll(':has(.tab):first').html() == null)
{ // we are on the last tab, so we go back on the first one
console.log('first tab');
$('.tab:first').click();
}
else
{
// Select next tab
console.log('next tab');
$(".tab.selected").closest('li').nextAll(':has(.tab):first').find('.tab').click();
}
}
}
// We attach the checkTabPress function to the "keyup" event
var body = document.querySelector('body');body.addEventListener('keyup', checkTabPress);
Javascript à ajouter a notre formulaire
Une fois ce javascript ajouté, il ne reste plus qu’a lancer le formulaire et à utiliser la touche tabulation pour changer d’onglet.
Enjoy 😎
