Appliquer un JS sur un shortcode
Bonjour,
J'ai un soucis pour faire exécuter un Js sur un shortcode wordpress, je m'explique:
J'utilise un plugin Super Store Finder (SSF) qui s'affiche avec un shortcode: [SUPER-ADD-LOCATIONS]
Je veux modifier le comportement d'un de ses champs (champs de texte, limiter le nombre de caractères)
Pour cela j'utilise une fonction dans le functions.php:
Code:
1 2 3 4 5 6 7 8
|
/** Load script Character limiter in Forms **/
function load_js_charlimit() {
if( is_page( 49 ) ) {
wp_enqueue_script('charlimit', get_stylesheet_directory_uri() . '/js/charlimit.js', array('jquery'), null, true);
}
};
add_action('wp_footer', 'load_js_charlimit'); |
Mon script js est:
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66
|
alert ('Je suis la');
input = document.querySelector('.nicEdit-main');
settings = {
maxLen: 5,
}
keys = {
'backspace': 8,
'shift': 16,
'ctrl': 17,
'alt': 18,
'delete': 46,
// 'cmd':
'leftArrow': 37,
'upArrow': 38,
'rightArrow': 39,
'downArrow': 40,
}
utils = {
special: {},
navigational: {},
isSpecial(e) {
return typeof this.special[e.keyCode] !== 'undefined';
},
isNavigational(e) {
return typeof this.navigational[e.keyCode] !== 'undefined';
}
}
utils.special[keys['backspace']] = true;
utils.special[keys['shift']] = true;
utils.special[keys['ctrl']] = true;
utils.special[keys['alt']] = true;
utils.special[keys['delete']] = true;
utils.navigational[keys['upArrow']] = true;
utils.navigational[keys['downArrow']] = true;
utils.navigational[keys['leftArrow']] = true;
utils.navigational[keys['rightArrow']] = true;
input.addEventListener('keydown', function(event) {
let len = event.target.innerText.trim().length;
hasSelection = false;
selection = window.getSelection();
isSpecial = utils.isSpecial(event);
isNavigational = utils.isNavigational(event);
if (selection) {
hasSelection = !!selection.toString();
}
if (isSpecial || isNavigational) {
return true;
}
if (len >= settings.maxLen && !hasSelection) {
event.preventDefault();
alert ('Nombre de caractère max dépassé');
return false;
}
}); |
Mon code est bien chargé dans le footer (même en header ca ne marche pas) de la page.
Il s'execute bien sur un champs texte que j'ai rajouté dans un bloque de code mais pas sur le champ du formulaire.
J'ai l'impression que le shortcode se charge après le chargement de la page (mon champs texte manuel apparaît avant le formulaire qui pourtant est au-dessus dans le contenu de la page)
Dans le Js j'ai placé des alert et elle s'affiche bien mais avant l'apparition du formulaire ?!?!
Qu'est ce que je fait mal ? Où comment faire pour charger mon Js après le shortcode ? Ma fonction est-elle correcte ou y a-t-il un autre moyen de faire ?
Merci de m'avoir lu et merci de votre aide.