Comment verifier le chargement d'un widjet
Résolu/Ferméflexi2202 Messages postés 3782 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 13 mars 2024 - 17 févr. 2023 à 14:12
- Comment verifier le chargement d'un widjet
- Verifier un lien - Guide
- Comment verifier un site internet - Guide
- Verifier compatibilite windows 11 - Guide
- Vérifier si mot de passe piraté - Guide
- Chargement des ressources logitech g hub - Forum Logiciels
4 réponses
17 févr. 2023 à 08:04
Bonjour
Lorsque le plugin est chargé, il doit y avoir des éléments identifiables via des id ou des class.
Il suffit donc de vérifier si ces éléments ou au moins l'un d'eux existe. S'il n'existe pas tu affiches ta div.
17 févr. 2023 à 11:51
bonjour Jordane
Merci pour la reponse
Dans mon cas tout le code du plugin s'affiche en effet a l'aide d'un ID
qui est zone_widjet
je pourrais faire ceci par exemple faire ceci tout simplement
if (document.getElementById("zone_Widget") !== null) {
alert("The element exists");
}
else {
alert("The element does not exist");
}
17 févr. 2023 à 12:08
Je pense que cette div (et cet ID) c'est toi qui l'a mis sur ton site.
Ce n'est pas le "contenu" du widget qui est chargé par le plugin lorsqu'il marche ....
Pour comprendre, regarde le code HTML généré sur ta page lorsque le plugin s'est bien chargé et regarde le contenu de la div en question pour voir ce qu'elle contient.
17 févr. 2023 à 12:51
Merci pour la reponse
en fait d'apres la documentation c''est L'ID Zone_Widget qui va contenir tout le code pour afficher les differents
comme on peux le voir dans cet extrait de documentation
<?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr" dir="ltr"> <head> <title>Mondial Relay Parcelshop Picker with Map</title> <!-- JQuery required (>1.6.4) --> <script src="//ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script> <!-- Leaflet dependency is not required since it is loaded by the plugin --> <script src="//unpkg.com/leaflet/dist/leaflet.js"></script> <link rel="stylesheet" type="text/css" href="//unpkg.com/leaflet/dist/leaflet.css" /> <!-- JS plugin for the Parcelshop Picker Widget MR using JQuery --> <script src="//widget.mondialrelay.com/parcelshop-picker/jquery.plugin.mondialrelay.parcelshoppicker.min.js"></script> </head> <body> <!-- HTML Element in which the Parcelshop Picker Widget is loaded --> <div id="Zone_Widget"></div> <!-- HTML element to display the parcelshop selected, for demo only. Should use hidden instead. --> <input type="text" id="Target_Widget" /> </body> </html>
Lorsque je supprime ce qui est dans le Head rien ne se charge
Par contre lorsque je laisse le code tel quel l'interieur de l'ID contient ceci
ou je vois bien les differences class et id
Donc si je comprends bien ton raisonnement il faudrait juste que je verifie par exemple si la class MRW-Content existe?
<div id="Zone_Widget"> <div class="MR-Widget MR-Widget-Responsive fr-FR"> <div class="MRW-Title"> Sélectionnez votre Point Relais<sup>®</sup> ou Locker </div> <div class="MRW-Errors" style="display: none"></div> <div class="MRW-Content"> <div class="MRW-Search"> <div class="MRW-Line"> <input type="hidden" class="Arg0" value="BDTEST "> <div class="MRW-Container MRW-CityContainer"> <label for="MRW-inputCity-bd876945-617a-421a-b3bd-6948d6c0599c"> Ville </label> <input id="MRW-inputCity-bd876945-617a-421a-b3bd-6948d6c0599c" type="text" class="iArg0" value=""> </div> <div class="MRW-Container MRW-CPContainer"> <label for="MRW-inputCP-bd876945-617a-421a-b3bd-6948d6c0599c"> CP </label> <input id="MRW-inputCP-bd876945-617a-421a-b3bd-6948d6c0599c" type="text" class="Arg2" value=""> </div> <div class="MRW-Container MRW-CountryContainer"> <input type="hidden" class="Arg1" value="BE"> <input type="hidden" class="Arg3" value="24R"> <input type="hidden" class="Arg4" value=""> <input type="hidden" class="Arg5" value="7"> <input type="hidden" class="Arg6" value=""> <input type="hidden" class="Arg7" value="75"> <input type="hidden" class="Arg8" value=""> <input type="hidden" class="Arg10" value=""> <img id="Img_Pays" class="MRW-flag" src="https://widget.mondialrelay.com/parcelshop-picker/v4_0/css/imgs/FR.png" alt="FR"> <div class="MRW-fl-Select"> <div class="MRW-fl-Item MRW-fl-Item-"><img src="https://widget.mondialrelay.com/parcelshop-picker/v4_0/css/imgs/fr.png" alt="FR"><span>FR</span></div> <div class="MRW-fl-Item MRW-fl-Item-"><img src="https://widget.mondialrelay.com/parcelshop-picker/v4_0/css/imgs/be.png" alt="BE"><span>BE</span></div> <div class="MRW-fl-Item MRW-fl-Item-"><img src="https://widget.mondialrelay.com/parcelshop-picker/v4_0/css/imgs/nl.png" alt="NL"><span>NL</span></div> <div class="MRW-fl-Item MRW-fl-Item-"><img src="https://widget.mondialrelay.com/parcelshop-picker/v4_0/css/imgs/lu.png" alt="LU"><span>LU</span></div> </div> </div> <div class="MRW-Container MRW-ButtonContainer"> <button class="MRW-BtGo"> Chercher </button> <button class="MRW-BtGeoGo" title="Autour de ma position"> <span></span> </button> <img src="https://widget.mondialrelay.com/parcelshop-picker/v4_0/css/imgs/ajax-loader.gif" class="progressBar" alt="" style="display: none;"> </div> </div> <div class="PR-AutoCplCity" style="width: 120px;"></div></div> <div class="MRW-Results" style=""> <div class="MRW-RList" style=""><div class="PR-List-Item" onclick="MR_jQuery("#Zone_Widget").trigger("FocusOnMap",0)"><input type="hidden" class="PR-Id" value="BE-006153"><div class="PR-Name">1 - N&A-BET-EXPRESS</div><div>BOULEVARD DE L'YSER 44</div><div></div><div>6000 - CHARLEROI</div></div><div class="InfoWindow InfoWindowFull" style="display:none"><div class="InfoWindowFull-Image"></div></div></div> </div> <div class="MRW-LockerModal new grid row modal overlay-confirm" id="LockerModal" style="display: none;"> <div class="modal-header line-b"> <span id="close-pop" class="close-pop" onclick="MR_jQuery("#close-pop").trigger("ClearSelection");"><span class="sr-only">Fermer la boîte de dialogue</span></span> </div> <div class="modal-body"> <div class="row "> <div class="col-md-12 alert-info-consigne consigne"> <p><strong class="surligne">Vous avez choisi une livraison en consigne automatique</strong></p> <div class="row "> <div class="three"> <span class="picto"> <img src="https://widget.mondialrelay.com//parcelshop-picker/v4_0/css/imgs/picto3-jours.png"></span> <p class="titre"><strong>Vous avez 3 jours pour retirer votre colis</strong></p> <p>Les consignes sont ouvertes 24h/24 et 7j/7 mais les colis restent disponibles 3 jours. Au-delà, vous serez invité à choisir un Point Relais® pour récupérer votre colis.</p> </div> </div> </div> </div> </div> <div class="modal-footer center"> <div class="row "> <div class="col-md-12"> <button class="btn green center-block" onclick="MR_jQuery("#close-pop").trigger("CloseModalLocker");">Je choisis cette consigne</button> <button class="btn pink-border center-block" style="margin-top:10px" onclick="MR_jQuery("#close-pop").trigger("ClearSelection");">Je choisis un autre Point Relais®</button> </div> </div> <span class="clearfix"></span> </div> </div> <div style="color: red; display: none;"> Warning : You are currently running the solution under the Demonstration Account, please use your own Mondial Relay parameters on your production environement. </div> </div> </div> </div>
17 févr. 2023 à 13:14
Bonjour,
Oui, la class MR-Widget par exemple
if (document.getElementsByClassName('MR-Widget').length) { alert('Class exists'); } else { alert('Class does not exist'); }
17 févr. 2023 à 14:12
Merci jordane
Cela fonctionne parfaitement
C'est vrai que cela est beaucoup mieux que mon idee que de controler la hauteur de la div