AnsweredAssumed Answered

Tri alpha sur zone d'une table Dojo

Question asked by fred_pack on Feb 19, 2010
Latest reply on Feb 22, 2010 by fred_pack
Bonjour,

J'ai adapté à mes besoins le trés bon tuto ci-dessous :
http://drquyong.com/myblog/?p=5

j'ai simplifié l'affichage pour n'avoir qu'une liste d'espaces et de docs consultables

tout fonctionne bien…, sauf que l'affichage se fait de manière 'aléatoire', alors que je voudrais trier l'affichage par ordre alpha sur la zone 'Nom'
Peut-être est-ce dans la définition de la table Dojo, enfin, c'est la que j'ai essayé de multiples tests, mais sans succès  :?

y-a-t-il une possibilité de trier cette table par ordre alpha sur une zone ?

mes codes :

mon url de web script :

http://ip_alfresco:8080/alfresco/service/sample/pack1/Company%20Home

mes scripts (dans l'espace Web Scripts Extensions) :

DocumentList.get.desc.xml :

<webscript>
  <shortname>Affichage Perso 1</shortname>
  <description>Affichage espace personnalisé 1</description>
  <url>/sample/pack1/{path}</url>
  <format default="html">argument</format>
  <authentication>guest</authentication>
  <transaction>required</transaction>
</webscript>

DocumentList.get.js

// Affiche l'espace par le chemin
var folder = roothome.childByNamePath(url.extension);
if (folder == undefined || !folder.isContainer)
{
   status.code = 404;
   status.message = "Espace " + url.extension + " inexistant";
   status.redirect = true;
}
model.folder = folder;


Et enfin

DocumentList.get.html.ftl

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
   <title>Gestion Documentaire </title>
   <script type="text/javascript">
      var djConfig = {
         isDebug: true
         ,debugAtAllCosts: true
      };
   </script>
   <script type="text/javascript" src="${url.context}/scripts/ajax/dojo/dojo.js"></script>
   <script type="text/javascript">
// JAVASCRIPT
      dojo.require("dojo.widget.FilteringTable");
      dojo.require("dojo.widget.InlineEditBox");
      dojo.require("dojo.widget.Dialog");
      dojo.require("dojo.event.*");
      dojo.hostenv.writeIncludes();
      
      var dlg,previewdlg,removedlg;
      function init(e) {
         dlg        = dojo.widget.byId("DialogContent");
         previewdlg = dojo.widget.byId("DialogPreview");
         removedlg  = dojo.widget.byId("DialogRemove");
      }
      dojo.addOnLoad(init);
      
      function populate(id,noderef) {
         document.getElementById("file_label").innerHTML='Edit File';
         document.forms['edit_new_form'].action = '${url.serviceContext}/simpleui/document/save';
         document.getElementById("file_name").value=document.getElementById("name_"+id).innerHTML;
         document.getElementById("file_description").value=document.getElementById("desc_"+id).innerHTML;
         document.getElementById("file_body").value=document.getElementById("body_"+id).innerHTML;
         document.getElementById("file_noderef").value=noderef;
                       dlg.show();
      }
   </script>

   <style type="text/css">
      /*** CSS ***/
      table {
         font-family:Lucida Grande, Verdana;
         font-size:0.8em;
         width:100%;
         border:1px solid #ccc;
         border-collapse:collapse;
         cursor:default;
      }
      table td,
      table th{
         padding:2px;
         font-weight:normal;
      }
      table thead td, table thead th {
         background-image:url(${url.context}/images/dojo/ft-head.gif);
         background-repeat:no-repeat;
         background-position:top right;
      }
      table thead td.selectedUp, table thead th.selectedUp {
         background-image:url(${url.context}/images/dojo/ft-headup.gif);
      }
      table thead td.selectedDown, table thead th.selectedDown {
         background-image:url(${url.context}/images/dojo/ft-headdown.gif);
      }
      table tbody tr td{
         border-bottom:1px solid #ddd;
      }
      table tbody tr.alt td{
         background: #e3edfa;
      }
      table tbody tr.selected td{
         background: yellow;
      }
      table tbody tr:hover td{
         background: #a6c2e7;
      }
      table tbody tr.selected:hover td{
         background:#ff9;
      }
      #inputArea{
         margin:1em 0;
         padding:1em;
         background-color:#eef;
      }
      #updateTestInput{
         border:1px solid #ccc;
         width:100%;
         height:80px;
         font-family:serif;
         font-size:0.9em;
         overflow:auto;
      }
      .bar a img {
         border:0;
         vertical-align: middle;
      }
      .dojoDialog {
         background : #eee;
         border : 1px solid #999;
         -moz-border-radius : 5px;
         padding : 4px;
         width: 80%
      }
                .bleu {
                        color: #0000FF;
                }
               H1 {
                        color:#3300FF;
                        font-family:Lucida Grande, Verdana;
                   font-size: 8pt ;
                }
               a.lien {
                        color:#3300FF;
                }
               a.lien:hover {
                        color:#3366FF;
               }
               a.lien:visited {
                        color:#3300FF;
                }

   </style>

</head>

<body>
        <H1>Utilisateur : ${person.properties.firstName} ${person.properties.lastName}</H1>
     <H1>Espace Courant : ${folder.displayPath}/${folder.name}</H1>
        <br>

   <#if folder.parent.parent?exists>
   <H1><a href="${url.serviceContext}/sample/pack1<@encodepath node=folder.parent/>" class="lien">Remonter d'un niveau</a></H1>
   <br>
   </#if>



<table dojoType="filteringTable" id="documentList" alternateRows="true" maxSortable="2" cellpadding="0" cellspacing="0" border="0">
    <thead>
        <tr>
            <th field="Type" dataType="String" align="left" valign="top">Type</th>
            <th field="Nom" dataType="String" sort="asc" align="left" valign="top">Nom</th>
            <th field="DateDiffusion" dataType="DateTime" valign="top">Date Diffusion</th>   
        </tr>
    </thead>

    <tbody>
        <#list folder.children as child>
            <tr value="${child_index + 1}">
                <#if child.isContainer>
                    <!– Affichage Espace –>
                    <td><div id="name_${child_index + 1}">
                    <a href="${url.serviceContext}/sample/pack1<@encodepath node=child/>"><img src="/alfresco${child.icon32}" border=0></a></div></td>
                    <td><div id="name_${child_index + 1}">${child.name}</div></td>
                    <td> </td>
                <#else>
                    <!– Affichage Contenu –>
                    <td><div id="name_${child_index + 1}">
                    <a href="/alfresco${child.url}" target="new"><img src="/alfresco${child.icon32}" border=0></a></div></td>
                    <td><span class="bleu"><div id="name_${child_index + 1}">${child.name}</div></span></td>
                    <#if child.properties["SQ:dateDiffusion"]?exists>
                        <td>${child.properties["SQ:dateDiffusion"]?date}</td>
                    <#else>
                        <td> </td>
                    </#if>
                </#if>
            </tr> 
        </#list>
    </tbody>
</table>

<br>
<H1><a href="mailto:admin.alfresco@moi.com?subject=Anomalie">Reporter une anomalie</a></H1>

</body>
</html>
<#macro encodepath node><#if node.parent?exists><@encodepath node=node.parent/>/${node.name?url}</#if></#macro>

Petite précision, j'utilise une zone 'Date diffusion' qui est une méta-donnée des documents

Merci de votre aide

Cordialement

Fred

Outcomes