Mashup Builder > Widget > Widget standard > Widget Griglia > Modifica dei dati nel widget Griglia
Modifica dei dati nel widget Griglia
Per attivare la modifica nel widget Griglia, attenersi alla procedura descritta di seguito.
1. In Mashup Builder selezionare il widget Griglia nell'area di lavoro o utilizzando il pannello Navigatore.
2. Nel pannello Proprietà impostare IsEditable su True, quindi fare clic su pulsante di configurazione del widget per aprire la finestra di dialogo di configurazione del widget.
3. Nel riquadro di sinistra scegliere una colonna, quindi nel riquadro destro selezionare la casella di controllo Modificabile.
Facoltativamente, configurare le opzioni seguenti:
Selezionare la casella di controllo Obbligatorio per richiedere sempre un valore durante la modifica del contenuto della cella.
Definire un'espressione di convalida nella casella Espressione di convalida per applicare regole di convalida al contenuto della cella.
Definire i messaggi e i dettagli da visualizzare per la convalida.
4. Ripetere il passo precedente per ogni colonna che si desidera modificare.
5. Fare clic su Fine per chiudere la finestra di dialogo, quindi salvare il mashup.
Scelta di una modalità di modifica
Per controllare il modo in cui è possibile modificare la griglia in fase di esecuzione, impostare la proprietà EditLevel del widget su una delle opzioni seguenti:
Intera griglia - Consente di modificare le singole celle e di salvare le modifiche manualmente mediante un pulsante o un servizio.
Singola riga - Consente di modificare singolarmente le righe utilizzando un modulo.
Singola cella - Consente di modificare le celle singolarmente e di salvare le modifiche automaticamente al termine di una modifica.
Man mano che si apportano modifiche a una colonna in cui è attivata la convalida, viene valutato l'input per assicurarsi che i dati immessi siano validi. Quando la convalida non riesce, viene visualizzato un messaggio di errore e le modifiche non vengono salvate. Per ulteriori informazioni sulla convalida, vedere Convalida dell'input all'interno della griglia.
È possibile attivare la proprietà EditButton anziché la proprietà IsEditable. Se si imposta questa proprietà su true, viene aggiunto un pulsante di modifica alla barra degli strumenti della griglia. È possibile attivare o disattivare la modalità di modifica facendo clic sul pulsante in fase di esecuzione.
Modalità di modifica della griglia
La modalità di modifica della griglia consente di aggiornare più celle e quindi di salvare tutte le modifiche contemporaneamente facendo clic sul pulsante Salva.
Nell'immagine seguente vengono mostrati i pulsanti di modifica nell'area in alto a sinistra del widget in fase di esecuzione durante la modifica dell'intera griglia:
Facendo clic su Modifica, vengono visualizzati i pulsanti Salva e Annulla. Per ciascuna cella in cui è attivata la modifica nella griglia vengono visualizzati i controlli di modifica. È possibile modificare i dati per una o più celle, quindi salvare le modifiche facendo clic su Salva. Per evidenziare le celle che contengono modifiche non salvate, impostare la proprietà HighlightDraftState su True. Le celle con modifiche sono indicate da un colore di sfondo diverso.
Per questa modalità sono disponibili gli eventi di modifica seguenti:
EditStarted - Viene attivato quando si fa clic su Modifica.
EditCompleted - Viene attivato quando si fa clic su Salva.
EditCancelled - Viene attivato quando si fa clic su Annulla.
Modalità di modifica delle righe
La modifica delle righe consente di modificare una riga alla volta. Quando si attiva questa modalità, sul lato sinistro della griglia viene aggiunta una colonna contenente i controlli di modifica. L'immagine seguente mostra il widget griglia impostato sulla modalità di modifica delle righe:
Per modificare una riga, fare clic sull'icona di modifica o sul link. Viene visualizzato un modulo di modifica contenente le celle all'interno della riga. Dopo aver apportato le modifiche ai valori, fare clic su Aggiorna per salvare le modifiche della riga corrente.
Per questa modalità sono disponibili gli eventi di modifica seguenti:
EditRowStarted - Viene attivato quando si fa clic sull'icona di modifica o sul link per iniziare a modificare una riga utilizzando il modulo.
EditRowCompleted - Viene attivato quando si fa clic su Aggiorna.
EditCancelled - Viene attivato quando si fa clic su Annulla.
Modalità di modifica delle celle
Per questa modalità sono disponibili gli eventi di modifica seguenti:
EditCellStarted - Viene attivato quando si fa clic sull'icona di modifica o sul link per iniziare a modificare una cella.
EditCellCompleted - Viene attivato quando si preme INVIO oppure quando si fa clic all'esterno della cella dopo aver modificato il valore.
EditCancelled - Viene attivato quando si annulla la modifica della cella.
È possibile modificare una cella facendo clic sull'icona di modifica o sul link corrispondente. Quando la casella di modifica è attiva, viene visualizzato il valore non elaborato senza alcuna formattazione. Al termine della modifica, viene applicato il renderer di colonna per formattare il valore. Per ulteriori informazioni sui renderer, vedere Renderer e formati delle colonne della griglia.
* 
Per annullare una modifica senza salvare le modifiche, premere il tasto ESC.
Configurazione dei controlli di modifica
Utilizzare la proprietà EditControlType per visualizzare un'icona o un link per il controllo di modifica. È possibile sostituire l'icona con qualsiasi entità multimediale sul server utilizzando la proprietà EditControlIcon. Per modificare l'etichetta di modifica di default per il link, utilizzare la proprietà EditControlLabel. Per default, i controlli di modifica vengono visualizzati quando si posiziona il puntatore su una cella. È possibile configurare la visibilità dei controlli di modifica utilizzando la proprietà EditControlVisibility.
Attivazione della modifica mediante i dati di configurazione JSON
Aggiungere la seguente proprietà globale di livello superiore per attivare la modifica delle celle nella configurazione JSON.
var config = { “cellEditingEnabled”: true, “columns”: ... } };
Per attivare la modifica per una colonna, aggiungere i seguenti dati JSON:
...
“ColumnFormatter”: {
“type”: “boolean”,
“format”: “notext”,
“cellEditor”: {
“enabled”: true, // *{boolean} to indicate whether cell editing is enable for this column
},
}
...
È stato utile?