Mashup Builder > Widget > Widget legacy > Griglie avanzate (legacy) > Ordinamento, ricerca e filtro in una griglia avanzata e una griglia ad albero
Ordinamento, ricerca e filtro in una griglia avanzata e una griglia ad albero
L'ordinamento, la ricerca e il filtro dei dati della griglia vengono gestiti tramite un servizio di interrogazione della piattaforma standard con un singolo evento Filter e un parametro QueryFilter. Quando viene attivato l'evento Filter per eseguire l'ordinamento, la ricerca o il filtro dei dati della griglia, il parametro QueryFilter garantisce che i dati restituiti soddisfino tutte le condizioni specificate.
È possibile interrogare i dati per l'ordinamento, la ricerca e il filtraggio nei modi descritti di seguito.
Impostare una tabella dati contenente i dati e accedervi utilizzando l'API QueryDataTableEntries della piattaforma standard.
Se si generano dati in modo dinamico, tramite un servizio dati, utilizzare la funzione Interrogazione dell'infotable per ordinare e cercare i dati in un'infotable.
Per ulteriori informazioni sui parametri di interrogazione, vedere la sezione Parametro di interrogazione per servizi di interrogazione in ThingWorx Help Center.
Implementare l'ordinamento
1. Impostare la proprietà EnableSorting su true selezionandola nel pannello delle proprietà di Mashup Builder o definendola nello script JSON di un servizio di configurazione dinamico. La proprietà QueryFilter e l'evento Filter vengono visualizzati nel pannello delle proprietà.
2. Associare la proprietà QueryFilter al parametro di interrogazione di input in cui si trovano i dati da ordinare:
Se i dati si trovano in una tabella, associare QueryFilter al parametro di interrogazione del servizio QueryDataTableEntries.
Se si generano dati tramite un servizio dati, associare QueryFilter al parametro QueryFilter del servizio dati.
3. Associare l'evento Filtra al servizio che viene attivato all'avvio dell'ordinamento.
Se si utilizza una tabella dati, associare l'evento Filter al servizio QueryDataTableEntries.
Se si generano dati tramite un servizio dati, associare l'evento Filter al servizio dati.
Nell'esempio seguente viene mostrato un parametro di interrogazione con il nome e il titolo delle colonne di ordinamento applicati.
{"maxItems":100000,"query":{"sorts":[{"fieldName":"name","isAscending":true},{"fieldName":"title","isAscending":true}]}}
Dopo avere eseguito questi passi di associazione, il pannello Associazioni dovrebbe avere un aspetto simile al seguente:
Implementare la ricerca
La ricerca consente di trovare un valore stringa in qualsiasi colonna di una griglia.
1. Impostare la proprietà EnableGridSearch su true selezionandola nel pannello delle proprietà di Mashup Builder o definendola nello script JSON di un servizio di configurazione dinamico. Nel pannello delle proprietà vengono visualizzati la proprietà GridSearchLocation, la proprietà QueryFilter e Filtra.
2. Utilizzare la proprietà GridSearchLocation nel pannello delle proprietà di Mashup Builder o in uno script JSON per configurare una posizione per il campo di ricerca nella griglia. Le opzioni disponibili includono: in alto a destra, in alto a sinistra, in basso a destra e in basso a sinistra.
3. Associare la proprietà QueryFilter al parametro di interrogazione di output in cui si trovano i dati da cercare:
Se i dati si trovano in una tabella, associare QueryFilter al parametro di interrogazione del servizio QueryDataTableEntries.
Se si generano dati tramite un servizio dati, associare QueryFilter al parametro di interrogazione Filtra del servizio dati.
4. Associare l'evento Filter al servizio che viene attivato all'avvio della ricerca.
Se si utilizza una tabella dati, associare l'evento Filter al servizio QueryDataTableEntries.
Se si generano dati tramite un servizio dati, associare l'evento Filter al servizio dati.
Nell'esempio seguente viene mostrata un'interrogazione di ricerca dell'evento Pioggia in tutte le colonne.
{"maxItems":100000,"query":{"filters":{"type":"OR","filters":[{"fieldName":"id","type":"LIKE","value":"%Rain%"},{"fieldName":"date","type":"LIKE","value":"%Rain%"},{"fieldName":"max_temp","type":"LIKE","value":"%Rain%"},{"fieldName":"min_temp","type":"LIKE","value":"%Rain%"},{"fieldName":"cold","type":"LIKE","value":"%Rain%"},{"fieldName":"visibility","type":"LIKE","value":"%Rain%"},{"fieldName":"wind","type":"LIKE","value":"%Rain%"},{"fieldName":"precipitation","type":"LIKE","value":"%Rain%"},{"fieldName":"events","type":"LIKE","value":"%Rain%"},{"fieldName":"image","type":"LIKE","value":"%Rain%"},{"fieldName":"key","type":"LIKE","value":"%Rain%"},{"fieldName":"location","type":"LIKE","value":"%Rain%"},{"fieldName":"source","type":"LIKE","value":"%Rain%"},{"fieldName":"sourceType","type":"LIKE","value":"%Rain%"},{"fieldName":"tags","type":"LIKE","value":"%Rain%"},{"fieldName":"timestamp","type":"LIKE","value":"%Rain%"}]}}}
Implementare il filtro
Per implementare il filtro in una griglia, aggiungere un widget Filtro dati al mashup in cui si intende creare la griglia. È possibile aggiungere un widget Filtro dati solo a una griglia associata a una tabella dati basata su una data shape sottostante.
1. Nella scheda Widget sul lato sinistro di Mashup Builder, selezionare il widget Filtro dati e trascinarlo nel mashup.
2. Associare il parametro di interrogazione di output del widget Filtro dati alla proprietà QueryFilter della griglia avanzata. In questo scenario la proprietà QueryFilter gestisce una funzione di input e una funzione di output. Riceve l'input da Filtro dati, che viene automaticamente combinato con qualsiasi input di ordinamento e ricerca attivato, e genera un singolo output per il parametro di interrogazione.
3. Associare la proprietà QueryFilter al parametro di interrogazione di input del servizio QueryDataTableEntries della tabella dati filtrata, ordinata o utilizzata per la ricerca.
Nell'esempio seguente viene illustrata un'interrogazione di Filtro dati con un singolo parametro di filtro, un valore evento di Rain.
{"maxItems":100000,"query":{"filters":{"fieldName":"events","type":"LIKE","value":"Rain*"}}}
Un'interrogazione di filtro può diventare molto più complessa se vengono applicati più filtri o se l'input del filtro viene combinato con parametri di ricerca e ordinamento. Nell'esempio seguente viene illustrata una combinazione di parametri di ordinamento, ricerca e filtro in una singola interrogazione di output.
{"maxItems":100000,"query":{"sorts":[{"fieldName":"id","isAscending":true},{"fieldName":"min_temp","isAscending":true}],"filters":{"type":"And","filters":[{"type":"And","filters":[{"fieldName":"events","type":"LIKE","value":"Rain*"},{"fieldName":"cold","type":"EQ","value":false}]},{"type":"OR","filters":[{"fieldName":"id","type":"LIKE","value":"%21%"},{"fieldName":"date","type":"LIKE","value":"%21%"},{"fieldName":"max_temp","type":"LIKE","value":"%21%"},{"fieldName":"min_temp","type":"LIKE","value":"%21%"},{"fieldName":"cold","type":"LIKE","value":"%21%"},{"fieldName":"visibility","type":"LIKE","value":"%21%"},{"fieldName":"wind","type":"LIKE","value":"%21%"},{"fieldName":"precipitation","type":"LIKE","value":"%21%"},{"fieldName":"events","type":"LIKE","value":"%21%"},{"fieldName":"image","type":"LIKE","value":"%21%"}]}]}}
Nella griglia avanzata, se il filtro è in uso insieme all'ordinamento e/o alla ricerca, al completamento dell'operazione le associazioni dovrebbero avere un aspetto simile al diagramma seguente:
È stato utile?