Xpages - come realizzare lo StartKey sulle vostre applicazioni Web

tips Xpages TIPS DEVELOPERS

  • 0 commenti
Eccoci qua, giunti alla prima di una lunga serie (mi auguro n.d.r) di articoli di carattere tecnico legato allo sviluppo Xpages, la nuova tecnologia di sviluppo che IBM ha sposato dalla R8.5 di Notes/Domino.
Come già discusso in questi ultimi anni di eventi Dominopoint (DDay 2009, DDive 2010, DDive 2011)  le Xpages sono e saranno il futuro applicativo dello sviluppo Notes/Domino (Avete notato la nuova interfaccia di Notes Social Edition...cosa vi sembra?)
Dopo aver passato 3 anni in trincea nello sviluppo Xpages ed aver iniziato a formare in aula da oramai un anno a questa parte sviluppatori Notes e non solo sia a Milano che a Venezia è giunto il momento di iniziare a pubblicare qualche Tips tecnica che potrà sicuramente esservi utile per la realizzazione delle vostre applicazioni.

Iniziamo oggi con qualcosa di davvero semplice che sicuramente potrà esservi utile nelle vostre applicazione:

Re-ingegnerizzare lo STARTKEY di Notes nelle vostre applicazioni Xpages



Avete presente la funzionalità presente in qualunque vista Notes che alla pressione di un tasto fa partire una finestra di dialogo nella quale è possibile ricercare sulla prima colonna di una vista a partire da un determinato valore?

Image:Xpages - come realizzare lo StartKey sulle vostre applicazioni Web

Per poterla ricreare nel modo Xpages sono necessari i seguenti elementi che potremo sfruttare con estrema facilità grazie al Dojo Framework nativamente presente nell'ambiente Xpages:
  • Evento che cattura la pressione di un tasto sulla tastiera
  • Finestra di dialogo che visualizza un valore
  • Rappresentazione della vista
  • Posizionamento sulla vista a partire da un determinato valore

1) Evento che cattura la pressione di un tasto sulla tastiera


L'evento onKeyPress è la soluzione al nostro problema.
Tale evento viene gestito dalla libreria dojo.connect che nel nostro caso potrebbe essere realizzato con questa funzione JS client:
La funzione si aggancia al DOM object passato come targetConnect e alla pressione di un tasto numero o letterale mostra una dialog di Dojo e disconnette l'evento di keypress (altrimenti continuerebbero ad apparire un'infinità di finestre di dialogo)

function
startStartKey(idDialog,targetConnect,idField){
handle=dojo.connect(targetConnect,'onkeypress', function (evt){      
     console.log("keypress "+evt.charCode+" "+evt.keyCode);
     
       if (evt.charCode>=32 && evt.charCode<=122 ){
              var dialog=dijit.byId(idDialog);
              var car=String.fromCharCode(evt.charCode);
              dialog.show();
          dojo.byId(idField).value=car;
            dojo.disconnect(handle);
     }        
});

2) Finestra di dialogo che visualizza la finestra

Mi sono creato un custom control che come unico parametro riceve il titolo della dialogo (compositeData.title) e che ha un DIV  all'interno del quale c'è un pannello contenente
l'InputBox ed il bottone

Image:Xpages - come realizzare lo StartKey sulle vostre applicazioni Web

eccovi il codice sorgente dell'XML:


<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core" dojoParseOnLoad="true" dojoTheme="true">
     <xp:this.resources>
             <xp:dojoModule name="dijit.Dialog"></xp:dojoModule>
     </xp:this.resources>
      <xp:div id="dlgWrapper" style="display:none">
         
                       
        <xp:panel id="dlgstartKey" style="height:50.0px;width:200px">
             <xp:inputText id="inputTextStartKey" value="#{requestScope.startKey}"></xp:inputText>
             <xp:button value="cerca" id="button1">
                     <xp:eventHandler event="onclick" submit="true"
                             refreshMode="partial" refreshId="viewPanel1">
                             <xp:this.script><![CDATA[dijit.byId("#{id:dlgWrapper}").hide()]]></xp:this.script>
                     </xp:eventHandler>
             </xp:button>
     </xp:panel>
                     
     </xp:div>
      <xp:scriptBlock id="scriptBlock1">
              <xp:this.value><![CDATA[dojo.ready(function(){
id="#{id:dlgWrapper}";
titolo="#{javascript:compositeData.title}";
idfield="#{id:inputTextStartKey}";
var dialogWidget = dijit.byId(id);
if( dialogWidget ) dialogWidget.destroy();
dialogWidget = new dijit.Dialog( {'title':titolo}, dojo.byId(id));
var dialog = dojo.byId(id);
dialog.parentNode.removeChild(dialog);
var form = document.forms[0]; form.appendChild(dialog);
dialogWidget.startup();
dojo.connect(dialogWidget,'onHide',function(){  
  console.log("Connected onHide here");    
      startStartKey(id,document,idfield);
      });
startStartKey(id,document,idfield);        
});]]>
</xp:this.value>
         

</xp:scriptBlock></xp:view>




Il bottone startKey sarà bindato ad una variabile di RequestScope chiamata StartKey
Image:Xpages - come realizzare lo StartKey sulle vostre applicazioni Web

Alla pressione del bottone CERCA negli event handler (Events del bottone):

  • per la parte Server scateno una partial update sulla ViewPanel della vista Xpages che voglio rinfrescare
  • per la parte Client  e per la parte client eseguo dijit.byId("#{id:dlgWrapper}").hide() che nasconderà la finestra

3) Rappresentazione della vista


Prendo il componente View delle Xpages nativo e lo draggo all'interno della mia pagina (il nome di default sarà ViewPanel1)

4) Posizionamento sulla vista a partire da un determinato valore


Image:Xpages - come realizzare lo StartKey sulle vostre applicazioni Web

Mi posiziono in all Proprierties della ViewPanel e sotto il ramo Data inserirò nell'evento server side JS la routine o codice SSJS da invocare (un valore di tipo stringa) ad esempio la mia variabile di scope bindata sull'InputBox

function
iniziaper(){
       if (!!requestScope.get("startKey")){
              return(requestScope.startKey)
              }
}

Ora avrete finito e digitando un qualunque valore da tastierà apparirà la dialog Dojo e premendo CERCA vi posizionerete sul primo elemento utile (se esiste) della prima colonna ordinata della vista

Image:Xpages - come realizzare lo StartKey sulle vostre applicazioni Web

A presto!

0 Commenti:

    Nessun Commento Trovato
Commenta articolo
 

Questo spazio web è stato creato da per un uso pubblico e gratuito. Qualsiasi tipo di collaborazione sarà ben accetta.
Per maggiori informazioni, scrivete a info@dominopoint.it

About Dominopoint
Social
Dominopoint social presence: