Configurazione delle colonne della griglia
Dopo avere associato un'origine dati a una griglia, è possibile utilizzare la finestra di dialogo Configura widget in Mashup Builder per personalizzare la griglia.
• Aggiungere titoli di colonna personalizzati.
• Allineare il contenuto all'interno dell'intestazione e all'interno delle celle.
• Impostare la larghezza minima e massima per le colonne.
• Personalizzare il renderer e applicare la formattazione dello stato.
• Escludere colonne specifiche dall'origine dati e riordinare le colonne nella griglia.
• Controllare la larghezza delle colonne utilizzando i pixel, le percentuali o le frazioni.
• Attivare la modifica per colonne specifiche quando la modifica è attivata per la griglia.
• Applicare la convalida dell'input per una colonna specifica quando è attivata la modifica.
Per configurare una colonna della griglia, attenersi alla procedura descritta di seguito.
1. Selezionare un widget Griglia nell'area di lavoro o utilizzando il pannello Navigatore.
2. Nel pannello Proprietà fare clic su 
. Viene visualizzata la finestra di dialogo di configurazione della colonna della griglia e vengono elencate le colonne dell'infotable.
. Viene visualizzata la finestra di dialogo di configurazione della colonna della griglia e vengono elencate le colonne dell'infotable.
3. Nel riquadro di sinistra sono disponibili le configurazioni seguenti:
◦ Per modificare l'ordine di visualizzazione delle colonne nella griglia, trascinare e ordinare le colonne nell'elenco.
◦ Per escludere una colonna dai dati della griglia, selezionare la casella di controllo Escludi a destra.
◦ Per nascondere una colonna dalla vista griglia di default, deselezionare la casella di controllo in Mostra. È possibile controllare la visibilità delle colonne nascoste in fase di esecuzione utilizzando il menu Visualizza o trascinando le intestazioni di colonna quando la proprietà ReorderColumns è attivata.
4. Selezionare una colonna dal pannello di sinistra, quindi configurare le opzioni seguenti a destra.
◦ Formato colonna - Opzioni generali relative al formato di colonna nella griglia.
▪ Titolo - Nome descrittivo per il titolo della colonna.
 | Per default, il nome della definizione di campo viene visualizzato all'interno dell'intestazione di colonna. Per modificare il testo dell'intestazione, è necessario digitare un titolo o selezionare un token di localizzazione. |
▪ Larghezza colonna - Imposta la larghezza della colonna. Per default, lo spazio disponibile viene suddiviso equamente tra le colonne.
▪ Larghezza minima colonne - Imposta la larghezza minima a cui la colonna corrente può ridursi.
▪ Larghezza massima colonne - Imposta la larghezza massima a cui la colonna corrente può estendersi.
| | I valori di larghezza minima e massima vengono ignorati quando si imposta una colonna su una larghezza fissa. |
▪ Allineamento orizzontale celle e Allineamento verticale celle - Il contenuto all'interno delle celle del corpo viene allineato in alto, al centro e in basso oppure a sinistra, a destra e al centro.
▪ Allineamento orizzontale intestazione - Il contenuto all'interno della cella di intestazione viene allineato in alto, al centro e in basso oppure a sinistra, a destra e al centro.
▪ Pulsante Ordinamento - Aggiunge un pulsante di ordinamento all'intestazione di colonna, che consente agli utenti di ordinare i valori in fase di esecuzione.
▪ Ordinamento iniziale - Consente di disporre i valori di colonna in un ordine decrescente o crescente quando la griglia viene visualizzata in fase di esecuzione.
▪ Modificabile - Attiva la modifica per il contenuto della colonna quando la griglia è in modalità di modifica.
Per ulteriori informazioni sulla convalida, vedere Convalida dell'input all'interno della griglia.
▪ Obbligatorio - Specifica se un valore è obbligatorio in ogni cella quando si modificano i dati della griglia.
▪ Espressione criteri di convalida - Specifica l'espressione da utilizzare per valutare l'input quando si modifica la colonna in fase di esecuzione.
▪ Messaggio di convalida - Il messaggio da visualizzare per i criteri di input e per l'errore.
▪ Dettagli criteri di convalida - Dettagli aggiuntivi da visualizzare sotto i criteri di convalida o il messaggio di errore.
▪ Messaggio esito positivo convalida - Messaggio da visualizzare quando la convalida ha esito positivo.
▪ Dettagli esito positivo convalida - Dettagli aggiuntivi da visualizzare sotto il messaggio di esito positivo della convalida.
▪ Escludi da modulo di modifica righe - Esclude la colonna dal modulo di modifica delle righe quando la modalità di modifica della griglia è impostata su un livello di riga.
◦ Renderer colonna - Consente di selezionare e configurare un renderer per i dati della colonna. Per ulteriori informazioni, vedere Renderer e formati delle colonne della griglia.
◦ Formattazione stato - Applica la formattazione dello stato alla colonna utilizzando un'entità di definizione dello stato. Per applicare una definizione di stato a una riga, utilizzare la proprietà RowFormat del widget.
5. Fare clic su Fine per applicare le modifiche alla griglia.
Modifica dell'ordine delle colonne della griglia
È possibile ordinare le colonne della griglia in uno dei modi descritti di seguito.
• Aggiungere l'attributo ordinal quando si definiscono le colonne in modo dinamico nei dati dell'infotable. Ad esempio:
.AddField({ name: column, baseType: "STRING", ordinal: 0.0})
| | L'attributo ordinal è supportato solo in ThingWorx 9.3.2 o versioni successive. Quando si utilizzano i dati di configurazione JSON per impostare l'ordine, il valore ordinale viene ignorato. |
• Specificare l'ordine utilizzando la proprietà columnIndex nella configurazione del widget JSON.
• Modificare l'ordine delle colonne utilizzando la finestra di dialogo di configurazione delle colonne.
• Aggiungere un pulsante di ordinamento per consentire agli utenti di ordinare i dati delle colonne in fase di esecuzione.
• Impostare la proprietà ColumnsMenuOptions del widget su Ordine, quindi utilizzare il menu di configurazione delle colonne in fase di esecuzione.
Attivazione di un evento quando si fa clic su un collegamento ipertestuale
Per default, quando si fa clic su un collegamento ipertestuale nella griglia in fase di esecuzione, viene aperto l'URL collegato. In ThingWorx 9.3.6 o versioni successive è possibile configurare il widget per attivare un evento.
1. Nella finestra di dialogo di configurazione della griglia selezionare una colonna dell'infotable contenente i dati del collegamento ipertestuale.
2. Nella scheda Renderer colonna selezionare Instrada link tramite evento.
3. Fare clic su Fine per chiudere la finestra di dialogo.
Nel pannello Proprietà sono elencate le proprietà indicate di seguito.
• LinkClicked - Evento che viene attivato quando si fa clic su un link.
• ClickedLinkData - Infotable contenente la riga di dati di un link su cui è stato fatto clic.
• ClickedLinkColumn - Restituisce il nome della colonna dell'ultimo link su cui è stato fatto clic. È possibile utilizzare questa proprietà quando una griglia contiene più colonne con collegamenti ipertestuali.
È possibile associare queste proprietà per passare i dati dei link a servizi o funzioni all'interno del mashup. Ad esempio, si possono associare le proprietà LinkClicked e ClickedLinkData a una funzione di navigazione che passa i dati a un nuovo mashup.