UpdatePanels et gestion des erreurs
Avec les anciennes versions d'Atlas la gestion des erreurs avec les UpdatePanels n'étaient pas des plus simples. Depuis Microsoft Ajax extension Beta 1 les choses ont changé, on peut désormais personnaliser la façon dont le client obtient l'erreur.
Prenons un exemple :
<%@ Page Language="C#" AutoEventWireup="true" %>
<script type="text/C#" runat="server">
protected void btn1_Click(object sender, EventArgs e)
{
throw new Exception("Ceci est le message");
}
</script>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="SC1" runat="server" />
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Button ID="btn1" runat="server" Text="Error" OnClick="btn1_Click" />
<br />
<%=DateTime.Now.ToLongTimeString() %>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>
</body>
</html>
Si je clique sur le bouton contenu dans l'UpdatePanel une requête asynchrone va être lancée puis l'exception va être levée et enfin le message d'erreur va s'afficher dans une classique "alert" JavaScript. La première chose que l'on peut faire pour personnaliser ce comportement est de s'abonner à l'évenement AsyncPostBackError du ScriptManager :
<asp:ScriptManager ID="SC1" runat="server" OnAsyncPostBackError="SC1_AsyncPostBackError" />
Puis de renseigner la propriété AsyncPostBackErrorMessage du ScriptManager.
protected void SC1_AsyncPostBackError(object sender, AsyncPostBackErrorEventArgs e)
{
SC1.AsyncPostBackErrorMessage = "pas de chance, croise les doigts et essaye encore !!!";
}
On aura toujours une alert JavaScript mais avec un message qui fait beaucoup moins peur :-) On peut aller encore plus loin en rajoutant quelques lignes de JavaScript :
<script type="text/javascript">
window.pageLoad = function(){
// On rajoute une fonction qui s'exécutera a tous les retours de requête Ajax
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(function(sender,e){
// On regarde si la requête s'est bien ou mal passé
if(e.get_error()){
// On affiche le message d'erreur dans un div
$get("error").innerText = e.get_error().description;
// On avertit qu'on a traité l'erreur qu'il n'est pas nécessaire d'afficher l'alert JavaScript
e.set_errorHandled( true );
}
});
}
</script>
Désormais l'utilisateur ne voit plus d'alert Javascript mais est avertis de l'erreur via le div d'id "error".
En tant que développeur on aime bien avoir des informations sur le StackTrace et pleins d'autres choses incompréhensible pour le commun des mortels, pour avoir accès à ces informations on peut modifier le code de la sorte :
protected void SC1_AsyncPostBackError(object sender, AsyncPostBackErrorEventArgs e)
{
if (Context.IsDebuggingEnabled)
{
SC1.AsyncPostBackErrorMessage = e.Exception.ToString();
}
else
{
SC1.AsyncPostBackErrorMessage = "pas de chance, croise les doigts et essaye encore !!!";
}
}
On voit donc que la gestion des erreurs au niveau des UpdatePanels peut être faite de manière beaucoup plus fine pour le bonheur des utilisateurs. :)
J'ai obtenu cette astuce à travers le blog de Luis Abreu : UpdatePanel: having fun with errors