11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour à tous,

Voici un exemple de page contenant une barre d'outils, et une iframe sur tout le reste de la page chargeant une URL donnée:
http://ow.ly/xwSn

Pour un projet, j'envisage de faire quelque chose de similaire pour rassembler sous une même interface de navigation un ensemble d'outils en ligne d'une entreprise. Ce sont en général de petits outils simples, éparpillés à différents endroits, qui seraient rendus plus faciles d'accès grâce à une page portail (liste des outils avec présentation) et une barre de navigation.

Un des problèmes de ce type de fonctionnement, c'est qu'en cours de navigation sur un site un rafraichissement de la page va recharger la page «parente», et du coup le contenu de l'iframe se réinitialise sur l'URL donnée dans l'attribut src. En gros, on se retrouve en général à la page d'accueil, et on peut perdre un contenu saisi dans un formulaire par exemple... ou tout simplement perdre son chemin.

Une solution que je vois pour ça est de rajouter un hash à l'URL de la page parente, en JavaScript, à chaque chargement de page:
monportail.com/nomdeloutil#http://nomdeloutil.truc.machin.com/dossier/bidule.php?pleindeparametres
Pas très élégant, et il y a des chances pour que même en le gérant bien un rechargement de page perde les données d'un formulaire.

Une autre solution serait, théoriquement, d'intercepter le rechargement de la page et de recharger le contenu de l'iframe à la place. Est-ce que vous connaissez un moyen à peu près fiable de faire cela?
Bonjour,

Je suis sceptique quant à l'interception du refresh de la page.

Une solution moins lourde que le hash (mais ne réglant pas tous les problèmes) serait de conserver l'URL de l'iframe dans un input de type hidden de la page mère, dont la valeur est - il me semble - conservée en cas de refresh.
Julien Royer a écrit :
Je suis sceptique quant à l'interception du refresh de la page.

Au niveau technique ou ergo?

Sur la technique, il me semble qu'il y a un évènement déclenché avant la fermeture de la page (refresh compris), onbeforeunload je crois, mais ma dernière lecture à ce sujet il y a quelques mois disait qu'on ne pouvait pas interompre la fermeture de page (ou le changement, ou le rechargement), juste exécuter quelque chose avant.

Sur l'ergonomie: c'est un mécanisme contestable, mais qui dans le cas présent peut représenter un moindre mal pour une amélioration globale de l'expérience utilisateur... en attendant quelque chose de plus solide qui nécessitera du SSO, une refonte de divers outils, etc.

Julien Royer a écrit :
Une solution moins lourde que le hash (mais ne réglant pas tous les problèmes) serait de conserver l'URL de l'iframe dans un input de type hidden de la page mère, dont la valeur est - il me semble - conservée en cas de refresh.

Intéressant, il faudra que je tente ça.
Florent V. a écrit :
Au niveau technique ou ergo?

Je pensais plutôt au niveau technique.

L'événement beforeunload permet d'afficher une fenêtre modale demandant à l'utilisateur s'il souhaite vraiment fermer la page.

L'événement unload permet d'exécuter du code une fois que la décision de fermer la page courante est définitive.

Rien ne permet donc d'empêcher le rechargement de la page. Tu peux par contre avertir l'utilisateur qu'il risque de perdre des données et qu'il ferait mieux d'utiliser le bouton "refresh" que tu proposes dans ta barre d'outils. Tu peux également utiliser l'événement unload pour enregistrer le plsu d'infos possibles sur la page affichée dans l'iframe.
Merci pour ces précisions. Si on met quelque chose en place (pas encore vendu Smiley cligne ), je mettrai à jour pour dire ce qu'on a retenu.