Par exemple, vous avez une liste de mails avec tous les liens HTML qui devrait montrer le corps du message:
<a href="mail/show/1" class="show">Message title</a>
Sans JavaScript, cela déclenche une requête HTTP au servlet qui charge le courrier identifié par 1
, transmet la demande à un JSP qui masque la liste des messages dans la vue et affiche le courrier dans la vue.
Avec JavaScript/JQuery, vous avez besoin d'écrire du code qui fait exactement la même chose avec l'aide d'Ajax, par exemple:
$('a.show').click(function() {
$.getJSON(this.href, callbackFunctionWhichHidesListAndShowsMail);
return false;
});
Du côté du serveur, vous devez établir une distinction entre les demandes normales et les demandes de ajax afin que vous peut renvoyer une réponse en conséquence.
boolean ajax = "XMLHttpRequest".equals(request.getHeader("x-requested-with"));
// ...
if (ajax) {
writeJson(response, mail);
} else {
request.setAttribute("mail", mail);
request.getRequestDispatcher("/WEB-INF/mail.jsp").forward(request, response);
}
Enfin, pour donner à l'utilisateur une option pour basculer entre les modes manuellement, vous devez définir un cookie ou de préférence (puisque les cookies sont disableable) passer des informations dans l'URL (pathinfo ou paramètre de requête) qui force le serveur pour désactiver l'émission des lignes <script>
.
... puis de laisser un utilisateur choisir la version HTML de base, avoir un paramètre de cookie qui ne sert pas le JS qui fait Ajax (ou tout ce qui en dépend). – Quentin
[Amélioration progressive] (http://en.wikipedia.org/wiki/Progressive_enhancement) est un autre terme qui illustre ce que vous voulez accomplir ... construire les bases sans ajax d'abord, puis superposer des fonctionnalités supplémentaires en plus de cela pour améliorer l'expérience de l'utilisateur. – ChrisR
Vous avez tous les deux raison, j'ai mis à jour la réponse en conséquence. – BalusC