> For the complete documentation index, see [llms.txt](https://docs.opencityitalia.it/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.opencityitalia.it/stanza-del-cittadino/guida-alla-creazione-dei-servizi-digitali/creare-un-servizio/le-funzioni/modificare-i-campi-di-un-nested-form.md).

# Modificare i campi di un Nested Form

Attraverso la [sezione Logic](/stanza-del-cittadino/guida-alla-creazione-dei-servizi-digitali/creare-un-servizio/le-funzioni/impostare-delle-azioni-automatiche-le-logiche.md)  è possibile modificare dinamicamente alcune proprietà dei componenti presenti all'interno di un nested form.

In questo modo, il nested form non viene modificato in modo permanente nella sua definizione originale, ma assume una struttura differente solo all'interno del servizio in cui le logiche sono state configurate.

La modifica delle proprietà di un Nested Form tramite condizioni logiche è una funzionalità potente ma delicata: se utilizzata in modo improprio, può compromettere il servizio, interrompendo il flusso di compilazione e pregiudicando l'esperienza utente.

### Cosa puoi modificare

Di seguito trovi le proprietà che puoi modificare, con un esempio di codice per ciascuna. Il codice completo va inserito nel campo "Custom Action (Javascript)", come spiegato in [Come configurare la modifica](#come-configurare-la-modifica).

<details>

<summary>Obbligatorietà</summary>

{% hint style="warning" %}
Prima di rendere facoltativo un campo, verifica queste regole:

* per ragioni tecniche legate all'invio della pratica, il codice fiscale del richiedente (`applicant`) **non può essere reso facoltativo**;
* è **fortemente sconsigliato** rendere facoltativo l'indirizzo email del richiedente (`applicant`), poiché in tal caso l'utente non riceverebbe le notifiche relative all'avanzamento delle sue pratiche;
* in generale, i campi che definiscono il nested form (es. l'importo dell'ISEE) **non devono essere resi facoltativi.**
  {% endhint %}

Inserisci il codice JavaScript nel campo "Custom Action (Javascript)" per rendere opzionale un campo del Nested Form (ad esempio, "Data di nascita" nel form "OC - Beneficairio").

```javascript
window.FormioHelper.editFormProperties(instance, {
  birth_date: {
    "validate.required": false,
  }
});
```

Al contrario, per rendere obbligatorio un campo che non è obbligatorio di default, sostituisci **`false`** con **`true`**.

</details>

<details>

<summary>Etichetta</summary>

Inserisci il codice JavaScript nel campo "Custom Action (Javascript)" per modificare l'etichetta (label) di un campo del Nested Form (ad esempio, cambiare "Particella o mappale" in "Particella" nel form "OC - Immobili").

```javascript
window.FormioHelper.editFormProperties(instance, {
  parcel: {
    "label": "Particella",
  }
});
```

</details>

<details>

<summary>Visibilità del componente</summary>

Inserisci il codice JavaScript nel campo "Custom Action (Javascript)" per nascondere un campo del Nested Form (ad esempio, nascondere il campo "Data di nascita" nel form "OC - Beneficiario").

```javascript
window.FormioHelper.editFormProperties(instance, {
  birth_date: {
    "hidden": true,
  }
});
```

Al contrario, per rendere visibile un campo che non è visibile di default, sostituisci **`false`** con **`true`** (ad esempio nei casi in cui la modifica dipenda da un valore variabile)

</details>

<details>

<summary>Suffisso e prefisso di un campo</summary>

Inserisci il codice JavaScript nel campo "Custom Action (Javascript)" per inserire un suffisso e/o un prefisso di un campo del Nested Form (ad esempio, per il campo "Volumetria del fabbricato" nel form "OC - Immobili").

```javascript
window.FormioHelper.editFormProperties(instance, {
  volume: {
    "prefix": "volumetria",
    "suffix": "metri cubi"
  },
});
```

Per nascondere il suffisso di un campo, inserisci:

```javascript
window.FormioHelper.editFormProperties(instance, {
  volume: {
    "suffix": "",
  }
});
```

Per nascondere il prefisso di un campo, invece, inserisci:

```javascript
window.FormioHelper.editFormProperties(instance, {
  volume: {
    "prefix": "",
  }
});
```

</details>

<details>

<summary>Tooltip di un campo</summary>

Inserisci il codice JavaScript nel campo "Custom Action (Javascript)" per inserire un tooltip associato ad un campo del Nested Form (ad esempio, aggiungere o modificare il tooltip del campo "Foglio" nel form "OC - Immobili").

```javascript
window.FormioHelper.editFormProperties(instance, {
  sheet: {
    "tooltip": "Numero di una porzione di territorio nel catasto comunale",
  }
});
```

Per nascondere invece il tooltip di un campo, inserisci:

```javascript
window.FormioHelper.editFormProperties(instance, {
  sheet: {
    "tooltip": ""
  }
});
```

</details>

<details>

<summary>Descrizione di un campo</summary>

Inserisci il codice JavaScript nel campo "Custom Action (Javascript)" per inserire la descrizione di un campo del Nested Form (ad esempio, modificare o aggiungere la descrizione del campo "Foglio" nel form "OC - Immobili").

```javascript
window.FormioHelper.editFormProperties(instance, {
  sheet: {
    "description": "Numero che identifica una porzione di territorio nel catasto comunale",
  }
});
```

Per nascondere invece la descrizione di un campo, inserisci:

```javascript
window.FormioHelper.editFormProperties(instance, {
  sheet: {
    "description": ""
  }
});
```

</details>

## Come configurare la modifica

Una volta scelto cosa modificare, segui questi passaggi per applicarlo nel service builder.

### Configura la logica

Collocati nella sezione "Logic" del componente e aggiungi una logica avanzata

<figure><img src="https://4252442743-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrdV0mwA7iy2c3I7wu5BX%2Fuploads%2FlibZvI5TnezK9VGzUzsA%2Fimage.png?alt=media&amp;token=7893fe57-2997-480a-b8ff-f2039b6baf2b" alt=""><figcaption></figcaption></figure>

Inserisci il nome della logica creata (1) e come *trigger* seleziona la tipologia "Javascript" (2).

<figure><img src="https://4252442743-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrdV0mwA7iy2c3I7wu5BX%2Fuploads%2FhSBmOji9ifWGkiG33Kas%2Fimage.png?alt=media&amp;token=97542648-fe4d-47dc-ad65-25472d0e1545" alt=""><figcaption></figcaption></figure>

Se la modifica deve essere sempre eseguita, digita `result = true` nel campo "Text Area".

<figure><img src="https://4252442743-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrdV0mwA7iy2c3I7wu5BX%2Fuploads%2FNpspcSIyr2hbTTpnS6ju%2Fimage.png?alt=media&amp;token=001d35a6-7761-4ae7-a0f7-06f194391f19" alt=""><figcaption></figcaption></figure>

Se la modifica dipende dal valore di un campo variabile (ad esempio, una select ruolo in cui i valori sono "Genitore", "Tutore" e "Affidatario"), è necessario definire esplicitamente **tutte le condizioni in altrettante logiche**. Infatti, il form **non ripristina automaticamente lo stato precedente** se viene configurata solo una delle due condizioni.

<div><figure><img src="https://4252442743-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrdV0mwA7iy2c3I7wu5BX%2Fuploads%2FLm9sBk70qtpjTGcN1zu5%2Fimage%20(14).png?alt=media&amp;token=7fddef31-2fc0-4197-9b64-4fb28d3df1b7" alt=""><figcaption></figcaption></figure> <figure><img src="https://4252442743-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrdV0mwA7iy2c3I7wu5BX%2Fuploads%2FSDXuucfOk9j0RxlqmkT1%2Fimage%20(13).png?alt=media&amp;token=3617bc30-76c3-454f-927e-850569522f89" alt=""><figcaption></figcaption></figure></div>

Una volta creata la logica, clicca su "Add Action" per aggiungere l'azione da eseguire

<figure><img src="https://4252442743-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrdV0mwA7iy2c3I7wu5BX%2Fuploads%2F2PpgSvfOqTXDHoK83kfn%2Fimage.png?alt=media&amp;token=d0d3c578-c21b-464e-aa5f-b9e6073171b0" alt=""><figcaption></figcaption></figure>

Configura l'azione inserendo il titolo (1) e indicando la tipologia "Custom Action" (2).

<figure><img src="https://4252442743-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrdV0mwA7iy2c3I7wu5BX%2Fuploads%2FkvRKupv5KDs2jBfaWmzN%2Fimage.png?alt=media&amp;token=a9afc002-29c7-491a-95bc-36dbded35dee" alt=""><figcaption></figcaption></figure>

La tipologia "Custom Action" attiva la sezione "Custom action (Javascript)", da usare per inserire il codice della tua azione.

<figure><img src="https://4252442743-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrdV0mwA7iy2c3I7wu5BX%2Fuploads%2FJkDkgEZqhr3tXOsi8UAJ%2Fimage.png?alt=media&amp;token=f4967053-bbb2-4a41-a909-5ebeab5b011f" alt=""><figcaption></figcaption></figure>

Durante la modifica della proprietà, ricorda di racchiudere il tuo codice inserendo:

1. `window.FormioHelper.editFormProperties(instance, {` all'inizio.
2. `})` alla fine (per chiudere la funzione).<a class="button secondary"></a>

In pratica, la struttura del tuo codice dovrà assomigliare a questa:

```javascript
window.FormioHelper.editFormProperties(instance, {
// Il codice personalizzato
})
```

## Recuperare il *property name* dei componenti del nested form

Il property name dei campi varia a seconda dello specifico "Nested Form" utilizzato.

Per conoscere il property name corretto, consulta la pagina [I nested form](/stanza-del-cittadino/guida-alla-creazione-dei-servizi-digitali/creare-un-servizio/i-componenti/i-nested-form.md): nell'expandable di ogni nested form trovi l'elenco completo dei path dei campi.

{% hint style="info" %}
Ad esempio, per il campo "Numero civico" del beneficiario il path è `data.beneficiary.data.birth_place` : il valore da inserire è `birth_place`.
{% endhint %}

<div><figure><img src="https://4252442743-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrdV0mwA7iy2c3I7wu5BX%2Fuploads%2FaM3f3kPr7cikLG6qLuOd%2FScreenshot%202026-09-04%20alle%2017.50.08.png?alt=media&amp;token=1bfd8b3c-268b-4756-93ed-583b2743d35c" alt=""><figcaption></figcaption></figure> <figure><img src="https://4252442743-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrdV0mwA7iy2c3I7wu5BX%2Fuploads%2FBTN3n0YaDg2AxpHMlQVb%2FScreenshot%202026-09-04%20alle%2017.51.16.png?alt=media&amp;token=5e631189-34c3-4833-8bf5-2b5f885a1014" alt=""><figcaption></figcaption></figure></div>

## Modificare un componente di un Nested Form annidato

Per modificare i campi presenti in Nested Form che a loro volta contengono altri Nested Form, è necessario indicare il percorso completo del campo, racchiudendolo tra virgolette.

Per esempio, voglio rendere non obbligatorio il campo "Indirizzo" contenuto nel nested form OC - Residenza, a sua volta contento nel nested form OC - Immobili.

La sintassi sarà `"address.street_address"` , dove:

* `address` = property name del nested form OC - Residenza all’interno di OC - Immobili
* `street_address` = property name del campo "Indirizzo" all’interno di OC - Residenza

```javascript
window.FormioHelper.editFormProperties(instance, {
  "address.street_address": {
    "validate.required": false
    }
});
```

<div data-full-width="true"><figure><img src="https://4252442743-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrdV0mwA7iy2c3I7wu5BX%2Fuploads%2FmgIStLks4sEtebjiDDe7%2Fimage%20(11).png?alt=media&amp;token=8045a54e-5693-4f1b-8195-b6ec8c717bfc" alt=""><figcaption></figcaption></figure></div>


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation by asking a question.

Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:

```
GET https://docs.opencityitalia.it/stanza-del-cittadino/guida-alla-creazione-dei-servizi-digitali/creare-un-servizio/le-funzioni/modificare-i-campi-di-un-nested-form.md?ask=<question>&goal=<user_goal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
