Supporto volontario e collaborativo per Joomla!® in italiano

Segretariato sociale-info. Terza parte

Valutazione attuale: 0 / 5

Stella inattivaStella inattivaStella inattivaStella inattivaStella inattiva
 
Segretariato sociale-info. Terza parte.

Per chi è approdato in questa terza parte consiglio di leggere la prima e la seconda parte dell'articolo: Prima parte - Seconda parte.
Stiamo usando le estensioni per Joomla! ChronoForms e ChronoConnectivity versione 5 della Chronoengine.com

In questa terza parte vedremo come ottimizzare il form con CF, la connessione con CC e i menù di Joomla! per dare modo agli utenti di visualizzare i contenuti delle schede e stamparli.

Utilizzeremo lo stesso form creato con ChronoForms per modificare le informazioni ma con opportuni cambiamenti negli elementi del Designer e alle azioni del Setup del form.


In questa terza parte faremo:
-le modifiche al form che useremo per far vedere agli utenti le informazioni delle singole schede
-il form che servirà a stampare le schede
-la connessione con ChronoConnectivity per creare la lista delle schede da visualizzare
-la connessione con ChronoConnectivity per creare la lista delle schede da stampare
-la terza parte del menù di Joomla! che servirà a fare il link per la visualizzare la lista delle schede e per la stampa.

1. CHRONOFORMS

Iniziamo da Forms Manager → facendo il copia e incolla del modulo segr_soc_modulo_servizi_modifica
Apriamo la copia del form e iniziamo a fare le opportune modifiche.
Form name: segr_soc_modulo_servizi_pubblico . Scriviamo pubblico al posto di modifica
Form description: FORM SCHEDE PER GLI UTENTI
Non occorre fare altro.

Designer.
Dobbiamo modificare una parte di tutti gli elementi presenti nel Container.

Il primo elemento Hidden FieldField Name: modulopubblico[id]

Figura 1



Continuiamo a fare queste modifiche come la figura 1 in AREA, ARGOMENTO, INFORMAZIONI, APPROFONDIMENTI, AVVERTENZE scrivendo in ogni singolo Field Name: modulopubblico[..........] . Ad esempio in AREA scriviamo modulopubblico[area] , in ARGOMENTO scriviamo modulopubblico[argomento] e così via.

Non faremo la modifica ai successivi due Custom Code , cioè l'intestazione MODULO PER LA DOMANDA.
Faremo invece la modifica al codice del Custom che permette di aprire l'allegato.
<a target="_blank" href="/components/com_chronoforms5/chronoforms/uploads/segr_soc_modulo_servizi_operatore/{modulopubblico.doc_allegato}" class="btn btn-default" title="Apri allegato"> Apri modulo</a>
<br>

Al posto di modulomodifica scriveremo modulopubblico

Figura 2



Faremo la modifica all'elemento DOVE INVIARE LA RICHIESTA , sempre in Field Name modulopubblico[dove_inviare_richiesta]

Non faremo la modifica al Custom sottostante, cioè il Custom per l'intestazione ULTERIORI DOCUMENTI DA ALLEGARE ALLA DOMANDA

Ai successivi 6 Multi Field dovremo modificare i Field Name di ogni singolo Text Box e il codice di ogni Custom.

<a target="_blank" href="/components/com_chronoforms5/chronoforms/uploads/segr_soc_modulo_servizi_operatore/{modulopubblico.allegato_1}" class="btn btn-default" title="Apri allegato"> Apri allegato</a>
<br>
Figure 3 e 4

Figura 3



Figura 4



Modifichiamo gli altri 5 Multi Field rimanendi considerando le figure 3 e 4.

Continuiamo a fare le modifiche negli elementi TERRITORIO E STRUTTURE, FONTE INFORMATIVA.

Abbiamo terminato le modifiche agli elementi del form. Occorre solo togliere dal form il pulsante Submit button cliccando sul tasto rosso Delete.
Togliere il pulsante dal form è solo il primo passo che eviterà di apportare delle modifiche alla scheda da parte dell'utente finale. La seconda parte di questo aspetto la vedremo nel Setup.

Setup.
HTML (Render Form) non occorre fare nulla.
Db Read → Action Label scriviamo: Modulo servizi pubblico
Model ID scriviamo: modulopubblico
Conditions: occorre apportare questa modifica <?php return array('modulopubblico.id'=>$form->data['gcb']); ?>
In Db Read non occorre fare altro.

File Upload ed Event Loop lasciamoli così come sono.

La cosa importante da fare e togliere dal Setup l'azione Db Save cliccando su Delete
Togliendo l'azione Db save non è possibile fare nessun tipo di modifica alla scheda. In questo modo impostiamo il form solo per la lettura delle informazioni (Db Read) e non per le modifiche, questo è il secondo passo per evitare modifiche al form da parte degli utenti finali.

Connection Actions:
Connection name → scriviamo segr_soc_modulo_servizi_pubblico
Connection's action → lasciamo scritto save

Dobbiamo avere il Setup come da figura 5.

Figura 5




Abbiamo finito con il Setup, possiamo salvare e uscire

Stampa.
Adesso creeremo il form per la stampa delle schede.

Da Forms Manager → un clic sull'icona New
Nel nuovo form, in:
Form name → scriviamo: segr_soc_modulo_stampa
Form description → scriviamo: FORM STAMPA SCHEDE
Published → Yes
Setup mode → Advanced
Non occorre fare altro

Designer.
Non è necessario utilizzare un Container come abbiamo fatto negli altri forms.
Quindi da Basic trasciniamo un elemento Hidden Field:
Field Name scriviamo: modulostampa[id]
Field Value scriviamo: {gcb}
Non occorre fare altro
Salviamo l'elemento

Da Advanced trasciniamo un elemento Custom, in:
Label → vuota
Pure code → Yes
Code → inseriamo il codice sottostante.
Premetto che questo codice lo usa Vales nella sua web application Albo Pretorio on-line.
E' un codice php con all'interno una funzione JavaScript specifica per la stampa che richiama una tabella HTML. La caratteristica è quella di stampare una pagina web ripulendola di tutta la parte superflua. Utilizzando modulostampa[id] e {gcb} stampa solo il contenuto testuale (pulito) prelevandolo da ogni singolo campo del DB.
Noterete anche il richiamo dell'icona stampa che, volendo, può anche essere personalizzata da qui: <?php echo JURI::base().'media/system/images/printButton.png';?>" alt="Stampa" />

Non ho fatto altro che ottimizzare la tabella in HTML a mio piacimento ed inserire i tag all'interno della funzione.

Questo è il codice:

<?php
$js=<><EOF
<script type="text/javascript">
//<![CDATA[
function printDiv()
{
var a = window.open('',"b", "height=500,width=600,menubar=yes,scrollbars=yes,resizable=yes,,left=10,top=10");
a.document.open("text/html");
a.document.write(document.getElementById('foo').innerHTML);
a.document.close();
a.print();
}
//]]>
</script>
EOF;
echo '<div id="foo">';
echo $js;
?>
<div style="float: right; clear:both;" id="PSR_print"><img onclick="printDiv();" src="/<?php echo JURI::base().'media/system/images/printButton.png';?>" alt="Stampa" /></div>
<!-- INIZIO AREA STAMPA - INSERIMENTO TABELLA HTML -->
<div align="left">
<table width="700" border="0">
<tr>
<td>
<div align="justify"><font face="Arial, Helvetica, sans-serif"><b>SEGRETARIATO
SOCIALE. STAMPA SCHEDA SERVIZIO.<br>
<br>
</b></font></div>
</td>
</tr>
<tr>
<td>
<div align="left"><font face="Arial, Helvetica, sans-serif" color="#0000FF"><b>AREA</b>:
</font><font face="Arial, Helvetica, sans-serif">{modulostampa.area}</font><font face="Arial, Helvetica, sans-serif" color="#0000FF">
</font></div>
</td>
</tr>
<tr>
<td height="24">&nbsp;</td>
</tr>
<tr>
<td>
<div align="left"><font face="Arial, Helvetica, sans-serif" color="#0000FF"><b>ARGOMENTO</b>:
</font><font face="Arial, Helvetica, sans-serif">{modulostampa.argomento}</font><font face="Arial, Helvetica, sans-serif" color="#0000FF">
</font></div>
</td>
</tr>
<tr>
<td height="26">
<div align="left"></div>
</td>
</tr>
</table>
</div>
</div><!--FINE AREA STAMPA -->

I singoli campi vengono richiamati nel seguente modo: {modulostampa.area} e così via per gli altri campi.
La tabella non è completa ma è solo un esempio iniziale per personalizzarla.
Nel Designer non occorre fare altro.

Setup.
Un clic su Setup e iniziamo il settaggio.
Trasciniamo da Basic → HTML (Render Form) e lasciamolo come di default senza fare nulla.
Trasciniamo un DB Read.
In questa azione:
Action Label scriviamo: Modulo per la stampa
Enabled: Yes
Table Name: selezioniamo la tabella segr_soc_servizi
Multi read: No
Enable Model ID: Yes
Model ID: modulostampa
Fields, Order e Group lasciamoli vuoti
Conditions scriviamo <?php return array('modulostampa.id'=>$form->data['gcb']); ?>
Possiamo salvare e chiudere l'azione

Da External Apps trasciniamo l'azione Connection Action:
Connection's name scriviamo: segr_soc_modulo_stampa
Connection's action scriviamo: save

A questo punto abbiamo configurato il Setup e terminato il form per la stampa.
Un clic su Save and Close

Abbiamo creato due forms. Il primo per fare visualizzare agli utenti le schede informative, il secondo per fare la stampa delle schede.

Adesso creeremo le connessioni a questi due forms con ChronoConnectivity.

2. CHRONOCONNECTIVITY

Realizziamo la connessione per la visualizzazione della lista e l'apertura delle schede informative da parte degli utenti finali.

Realizziamo la connessione per la visualizzazione.
Da Connections manager un clic sull'icona New

2.1 LISTA DELLE SCHEDE INFORMATIVE PER L'APERTURA
General:
Connection name scriveremo: segr_soc_modulo_servizi_pubblico
Published: Yes

Models:
Model Title scriviamo: modulopubblico
Table name selezioniamo la tabella segr_soc_servizi
Fields scriviamo: id,user_id,user_id,area,argomento
Order scriviamo: modulopubblico.area ASC
Non occorre fare altro.

Front List.
Setting:
Display type: Table
Columns list scriviamo:
_EDIT_:Apri scheda
modulopubblico.area:Area
modulopubblico.argomento:Argomento

List displayTable:
Header code scriviamo:
<B>SEGRETARIATO SOCIALE. LISTA ARGOMENTI</B><BR>

Actionsedit:
Form event scriviamo: segr_soc_modulo_servizi_pubblico:load

Permissions:
Index:
Pubblic → Hallowed
Registered → Hallowed
Super → Halloved
Diamo la stessa configurazione per Wiev ed Edit

Save:
Pubblic → Inherited
Registered → Hallowed
Super → Halloved

Save_list:
Pubblic → Inherited
Registered → Hallowed
Super → Halloved

Toggle:
Pubblic → Inherited
Registered → Hallowed
Super → Halloved

Delete:
Pubblic → Denied
Registered → Hallowed
Super → Halloved

2.2 LISTA PER LA STAMPA DELLE SCHEDE INFORMATIVE
Realizziamo la connessione per la stampa.
Da Connections manager un clic sull'icona New

General:
Connection name scriveremo: segr_soc_modulo_stampa
Published: Yes

Models:
Model Title scriviamo: modulostampa
Table name selezioniamo la tabella segr_soc_servizi
Fields scriviamo: id,user_id,user_id,area,argomento
Order scriviamo: modulostampa.area ASC
Non occorre fare altro.

Front List.
Setting:
Display type: Table
Columns list scriviamo:
_EDIT_:Stampa
modulostampa.area:Area
modulostampa.argomento:Argomento

List displayTable:
Header code scriviamo:
<B>SEGRETARIATO SOCIALE. STAMPA SCHEDE</B>

Actionsedit:
Form event scriviamo: segr_soc_modulo_stampa:load

Permissions:
Index:
Pubblic → Hallowed
Registered → Hallowed
Super → Halloved
Diamo la stessa configurazione per Wiev ed Edit

Save:
Pubblic → Inherited
Registered → Hallowed
Super → Halloved

Save_list:
Pubblic → Inherited
Registered → Hallowed
Super → Halloved

Toggle:
Pubblic → Inherited
Registered → Hallowed
Super → Halloved

Delete:
Pubblic → Denied
Registered → Hallowed
Super → Halloved

3. ARTICOLO E MENU' DI JOOMLA!

ARTICOLO.

Creiamo un nuovo articolo che servirà per descrivere il servizio offerto agli utenti. Chiamiamo l'articolo Segretariato sociale.
Contenuti ArticoliNuovo articoloTitolo: Segretariato sociale → AccessoPublic
Nell'editor scriviamo le informazioni necessarie per informare gli utenti del servizio.

MENÚ
Schede informative.
Dal pannello di Amministrazione di Joomla! occorre creare una nuova voce di menù principale e la chiamiamo Segretariato sociale, servirà a collegarla a l'articolo Segretariato sociale
MenùMenù principaleNuovo
Nome e voce di menù: Segretariato sociale
Tipo voce di menù Seleziona → clicchiamo su la voce ArticoliSingolo articolo
Seleziona articolo → selezioniamo l'articolo appena creato Segretariato sociale
StatoPubblicatoAccesso Public.
Salva e chiudi.
Questo è il menù che servirà a creare altre due voci di menù utili a l'inkare la connessione per la visualizzazione della lista delle schede, l'apertura e la visualizzazione per la lista della stampa.

Creiamo la voce di menù Visualizza schede.
MenùMenù principale Nuovo
Nome e voce di menù: Visualizza schede
Tipo voce di menùSeleziona ChronoConnectivityConnection view Display Connection → Apriamo ChronoConnectivity dal pannello di amministrazione di Joomla! In OpzioniConnection's Name facciamo il copia/incolla di segr_soc_modulo_servizi_pubblico.
Ritorniamo nella voce di menù Dettagli → Voce principale selezioniamo Segretariato sociale. Stato → Publicato → Accesso → Public.
Salva e chiudi.

Creiamo la voce di menù Stampa schede.
Menù → Menù principale → Nuovo
Nome e voce di menù: Stampa schede
Tipo voce di menùSelezionaChronoConnectivityConnection view Display Connection → Apriamo ChronoConnectivity dal pannello di amministrazione di Joomla!
Opzioni → Connection's Name facciamo il copia/incolla di segr_soc_modulo_stampa
Ritorniamo in Dettagli → Voce principale selezioniamo Segretariato sociale. Stato → Publicato → Accesso → Public.
Salva e chiudi.

Se abbiamo eseguito i passaggi correttamente, il Menù principale Segretariato sociale con le due voci di menù Visualizza schede e Stampa schede è pronto per rendere visibile le liste a tutti gli utenti.

Con questo terzo articolo finisce il lavoro per la realizzazione dell'applicazione. È possibile fare le prove dalla DEMO
Ringrazio i lettori per l'attenzione.

CommentaCommenta questo articolo sul forum
Ho scritto e condiviso questo articolo su Joomla.it, fallo anche tu. Invia ora un nuovo articolo!
Giuseppe Zito
Nome: Giuseppe ZitoSito: https://www.cybercoords.it
Alcune informazioni su di me:


Ho anche scritto:
         ✔ diventa autore su Joomla.it

Ultima versione di Joomla!®

downloadVer. 3.7.4 Stabile Italiana
Data di rilascio: 25 Luglio 2017
(leggi la notizia Demo online

Le migliori estensioni gratuite

Un elenco aggiornato con i link a più di 100 estensioni fra componenti, moduli e plugin gratuiti per Joomla! 3

Manuale in italiano

Manuale in italianoPer conoscere meglio Joomla!, le sue caratteristiche ed il metodo di utilizzo leggi il manuale tradotto in italiano.

Molto utili anche le risposte alle domande più frequenti: FAQ

Sicurezza del proprio sito Joomla!Leggi anche: Nozioni sulla sicurezza del proprio sito

Autori di articoli recenti

Invia un articolo!Scrivi un articolo su Joomla.it e ricevi i ricavi dalle pubblicità di Google Adsense!
Segui queste istruzioni, condividi e collabora con la community. L'elenco degli autori attivi sul sito.

Libri consigliati

Torna su

Joomla.it sui Social Network

JoomlaDay Italia

JoomlaDay

Newsletter

Inserisci qui la tua e.mail: