2010-06-13 6 views
9

Je sais que cette frontière sur le tabou ici, et s'il vous plaît ne pas répondre avec « vous ne devriez jamais faire », etc.utilisateur quand ils ont frappé le bouton de retour navigateur - avec raison

J'ai un très long formulaire dans un assistant, et certains utilisateurs sont trop habitués à utiliser les boutons Précédent et Suivant du navigateur qu'ils utilisent à la place des boutons "Précédent" et "Suivant" de l'assistant de formulaire. Si elles frappent le bouton de retour du navigateur, elles perdront toutes leurs données de forme (ce qui est une douleur dans le cul, puisque le formulaire est si long).

Est-il possible d'afficher une alerte qui aura un bouton "me sortir d'ici" et un bouton "annuler", donc s'ils frappent annuler, il annulera la fonction du bouton retour?

+2

Je ne suis pas sûr que ce soit une règle "ne fais jamais ceci" que vous cassez. Stackoverflow m'avertit lorsque j'essaie de quitter une page sur laquelle je n'ai pas enregistré de modifications, et Gmail, et ma banque, etc. Et je suis toujours reconnaissant de l'avoir fait. J'ai également vu des données de formulaire multi-pages persister sur les actions du navigateur avant et en arrière, mais je serais satisfait de l'alerte de Sarfraz ci-dessous. – msw

Répondre

8

Vous devez retourner un message de l'événement onbeforeunload, comme ceci:

window.onbeforeunload = function() { 
    return "Leaving this page will reset the wizard"; 
}; 

Notez que cet événement se déclenche lorsque l'utilisateur quitte la page pour toute raison, même après la fin de votre assistant.
Vous devez définir un indicateur lorsque l'assistant a terminé et ne pas retourner un message.

+0

window.onbeforeunload = function() { return "Quitter cette page réinitialisera l'assistant"; }; a travaillé très bien. Bien que je préfère la syntaxe de jQuery, je n'ai pas pu obtenir le code de Sarfraz Ahmed pour afficher un bouton Annuler et OK. Merci SLaks –

+0

comment vous définissez un drapeau quand l'assistant finit? vraiment besoin de ça! –

+0

Cela dépend. Comment votre magicien finit-il? Faites un global 'var isWizardFinished = false;', puis définissez-le sur 'true' lorsque l'assistant a terminé. – SLaks

1

Vous pouvez utiliser le plugin barbecue jQuery pour réécrire la fonctionnalité des boutons suivant/précédent pour le rendre la transition plus seemless tout au long de ce « magicien »

http://benalman.com/projects/jquery-bbq-plugin/

Bien qu'il soit un peu complexe à installer, jetez un oeil aux exemples fournis si vous recherchez la même fonctionnalité.

Les chances sont que vous devrez probablement refactoriser votre code pour accommoder, et cela prendra des heures.

Questions connexes