Vous êtes ici Forums
  |  Connexion
 Forums
HomeHomeForums DNNForums DNNUtilisation - f...Utilisation - f...Ajax, cAjax, c'est mieux que je pensais...
Précédente
 
Suivante
Nouveau message
26/04/2007 15:17
 

Je croyais que l'intégration récente d'ASP.Net Ajax consistait dans le remplacement optionnel des fonctionnalités de l'API cliente AJAX native par celle du framework.

J'ai eu une très bonne surprise ce matin en lisant l'article que j'étais complètement à côté de la plaque... c'est bien mieux que ça:

tous les contrôles de modules déclarés comme tels (nouveau champs) sont automatiquement "ajaxifiés" par leur insertion dans UpdatePanel si le framework est présent.

Pour ma décharge, il semble qu'ils y soient allé molo dans l'ajaxification des contrôles existant pour l'instant.

Donc pour ceux qui comme moi étaient passé à côté, petite expérience:

  • Allez dans la page de gestion des thèmes graphiques
  • changez de thème et apréciez le postback (rafraichissement de la page)
  • Installez Asp.Net AJAX
  • Allez dans la page de gestion des thèmes graphiques
  • changez de thème et apréciez le callback (rafraichissement du module uniquement)

C'est pour l'instant l'un des seuls contrôles de modules ajaxifiés.

Mais y a pas de raison:

  • Ouvrez un text/html, passez en edition
  • changez de mode pour l'éditeur de texte et apréciez le postback
  • allez dans la definition du module text/html, editez le controle d'édition "Edit Text/Html"
  • Cochez "Rendu partiel" et sauvez
  • Ouvrez un text/html, passez en edition
  • changez de mode pour l'éditeur de texte et apréciez le callback
  •  

  • Ouvrez un user defined table prérempli,
  • triez sur une colonne et apréciez le postback
  • allez dans la definition du module, editez le controle UserDefinedTable.ascx
  • Cochez "Rendu partiel" et sauvez
  • Ouvrez un user defined table prérempli,
  • triez sur une colonne et apréciez le callback
  • Petit jeu: identifiez les contrôles du core et de votre mouture qui peuvent être "ajaxifiés" sans effet de bord. Contre-exemples: Event/Forum (perte des styles).

    Bonne nouvelle n'est-ce pas?


    Jesse
    Société de conseil et de service en 
informatique et systèmes d'information
     
    Nouveau message
    27/04/2007 03:07
     

    Salut Jesse,

    J'ai lu aussi l'article de Shawn, ça a l'air très simple d' "Ajaxifier" un module. Mais il cite aussi un espace de nom/classe à initialiser pour bénéficier pleinement d'Ajax. Sur ce point précis, as-tu déjà fait des tests ? Est-ce une sorte de pont vers l'API Ajax .Net ? Enfin, y a t'il une documentation quelque part et des exemples plus poussés que celui de Shawn ? Je pose toutes ces questions car je suis à 250% sur WWStore et je n'ai même pas eu le temps d'installer dnn 4.5.1 !

    Gilles

     
    Nouveau message
    27/04/2007 04:11
     

    Salut Gilles,

    pour ajaxifier un formulaire dans son ensemble tu n'as à priori pas besoin de rajouter quoique ce soit de plus. Le simple fait de son inclusion automatique dans un updatepanel transformera tous les postbacks natifs en callbacks.


    Jesse
    Société de conseil et de service en 
informatique et systèmes d'information
     
    Nouveau message
    29/04/2007 08:57
     

    Bonjour,

    désolé de ne pas pouvoir être plus actif que ça pour l'instant, mais j'ai tellement de boulot que ça m'est impossible...

    Sinon concernant ce sujet, voici quelques infos complémentaires :

    - la case à cocher "partial rendering" applique un "update panel" sur tous les controles présents dans la page et effectivement lors d'un rafraichissement partiel le code javascript ou les styles appliqués sur la partie rafraichie n'est pas à nouveau appliquer, ce qui fait que tous les modules ne peuvent pas être ajaxisés aussi facilement. Il faut donc ajaxiser le module manuellement en ajoutant les updatepanel soit même et en faisant exécuter une fonction javascript capable de recharger la feuille de style ou les javascript à appliquer sur la partie rafraichie.

    Je me suis amusé à ajaxisé le module "statistiques" \admin\Log\sitelog.ascx dont voici le code :

    <%@ Register TagPrefix="dnn" TagName="Label" Src="~/controls/LabelControl.ascx" %>
    <%@ Control Inherits="DotNetNuke.Modules.Admin.SiteLog.SiteLog" language="vb" AutoEventWireup="false" Explicit="True" CodeFile="SiteLog.ascx.vb" %>

     
    <table class="Settings" cellspacing="2" cellpadding="2" summary="Site Log Design Table" border="0" width="450">
     <tr vAlign="top">
        <td class="SubHead" width="150"><dnn:label id="plReportType" runat="server" controlname="cboReportType" suffix=":"></dnn:label></td>
      <td class="NormalBold" align="left" width="325">
       <asp:DropDownList ID="cboReportType" Runat="server" DataValueField="value" DataTextField="text" CssClass="NormalTextBox"></asp:DropDownList>
      </td>
     </tr>
     <tr>
        <td class="SubHead" width="150"><dnn:label id="plStartDate" runat="server" controlname="txtStartDate" suffix=":"></dnn:label></td>
      <td class="NormalBold" align="left" width="325">
       <asp:TextBox id="txtStartDate" CssClass="NormalTextBox" runat="server" width="120" Columns="20"></asp:TextBox>&nbsp;
       <asp:HyperLink id="cmdStartCalendar" resourcekey="Calendar" Runat="server" CssClass="CommandButton">Calendar</asp:HyperLink>
      </td>
     </tr>
     <tr>
        <td class="SubHead" width="150"><dnn:label id="plEndDate" runat="server" controlname="txtEndDate" suffix=":"></dnn:label></td>
      <td class="NormalBold" align="left" width="325">
       <asp:TextBox id="txtEndDate" CssClass="NormalTextBox" runat="server" width="120" Columns="20"></asp:TextBox>&nbsp;
       <asp:HyperLink id="cmdEndCalendar" resourcekey="Calendar" Runat="server" CssClass="CommandButton">Calendar</asp:HyperLink>
      </td>
     </tr>
     <tr>
      <td class="NormalBold" vAlign="top" align="center" colspan="2">

    <asp:UpdatePanel ID="UpdatePanelBoutons" runat="server">
    <ContentTemplate>

       <asp:LinkButton id="cmdDisplay" resourcekey="cmdDisplay" cssclass="CommandButton" Text="Display" runat="server"  />&nbsp;&nbsp;
       <asp:LinkButton id="cmdCancel" resourcekey="cmdCancel" CssClass="CommandButton" runat="server">Cancel</asp:LinkButton>
    </ContentTemplate>
    </asp:UpdatePanel>

      </td>
     </tr>
    </table>
    <br>

    <table><tr><td align="center">

    <asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanelBoutons">
    <ProgressTemplate><asp:image id="updating1" Imageurl="~/Images/ajax-loader.gif" runat="server"/></ProgressTemplate>
    </asp:UpdateProgress>

    </td></tr></table>

    <asp:UpdatePanel ID="UpdatePanelResultats" runat="server">
    <ContentTemplate>

    <asp:datagrid id="grdLog" Width="750" Runat="server" Border="0" CellPadding="4" CellSpacing="4"
        AutoGenerateColumns="true" HeaderStyle-CssClass="NormalBold"
        ItemStyle-CssClass="Normal" HeaderStyle-HorizontalAlign="Center"
        ItemStyle-HorizontalAlign="Center" BorderStyle="None"
        BorderWidth="0px" GridLines="None">
    </asp:datagrid>

    </ContentTemplate>
    </asp:UpdatePanel>

    <br>

    et à ajouter dans le code vb associé :

      Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
       Try

        If DotNetNuke.Framework.AJAX.IsInstalled Then
                        DotNetNuke.Framework.AJAX.RegisterScriptManager()
      End If

     Pour créer l'image d'attente :

    http://www.ajaxload.info/#preview

    et rien ne vous empêche aussi d'utiliser l'ensembles des controles de l'ajax toolkit http://ajax.asp.net/ajaxtoolkit/ 

    Roland

     


    Roland
     
    Nouveau message
    29/04/2007 09:00
     

    J'allais oublier, pour les controles ajax toolkit n'oubliez pas :

    <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>

    Roland


    Roland
     
    Précédente
     
    Suivante
    HomeHomeForums DNNForums DNNUtilisation - f...Utilisation - f...Ajax, cAjax, c'est mieux que je pensais...