Img parametri URL

Parametri URL in Bubble

Uno dei concetti base di Bubble.io sono i parametri url. In questo articolo andremo a capire che cosa sono e come impostarli.

Essi ci permettono di salvare delle informazioni all’interno del nostro browser url ed è possibile vedere la loro applicazione in tantissime app famose e all’interno del nostro Bubble editor.

In questo esempio il parametro name identifica la pagina dell’editor su cui stiamo lavorando,ide’ il nome della nostra applicazione e tab=1rappresenta la prima tab di Bubble e cioe’ quella relativa al design

I parametri sono separati dal resto del nostro browser url utilizzando un punto interrogativo “?”e vengono legati tra di loro con il simbolo “&”

Ogni parametro e’ formato da un nome o keye il valore che rappresenta, nel nostro esempio abbiamo tre parametri chiamati rispettivamente name, id e tab contenenti i seguenti valori testuali: index, ecosistemanocode e tabs-1, nome e valore vengono legati dal seguente simbolo “=”

Come impostare un parametro url in Bubble.io

Per impostare un parametro url dobbiamo usare l’azione chiamata “Go to page” nella sezione Navigation del workflow.

Tale azione richiedera’ di selezionare una pagina della nostra applicazione dove inviare il parametro e successivamente dobbiamo selezionare il checkbox “send more parameters” to the page per poter definire il nome e il valore per il nostro parametro

Nel caso in cui selezioniamo la pagina su cui stiamo lavorando Bubble inviera’ il parametro senza caricare nuovamente la pagina. Durante tale azione i parametri gia’ esistenti verranno cancellati percio’ se si vuole evitare di eliminarli possiamo utilizzare il check box “send current page parameters” che ci permettera’ di mantenerli.

Ogni volta che inviamo un parametro url Bubble conta il Go to page come singola azione e percio’ tutti quei workflow legati all’evento Page load verranno eseguti nuovamente. Il tipo di informazione che il nostro parametro puo’ contenere sara’ quella di un testo, numero, una data, un file, un oggetto del nostro database oppure un option set.

Creato il nostro parametro saremo in grado di utilizzarlo nel front end attraverso la sezione Condition di qualsiasi elemento del design e selezionando l’espressione Get data from page url

Nel caso in cui selezioniamo la pagina su cui stiamo lavorando Bubble inviera’ il parametro senza caricare nuovamente la pagina. Durante tale azione i parametri gia’ esistenti verranno cancellati percio’ se si vuole evitare di eliminarli possiamo utilizzare il check box “send current page parameters” che ci permettera’ di mantenerli.

Ogni volta che inviamo un parametro url Bubble conta il Go to page come singola azione e percio’ tutti quei workflow legati all’evento Page load verranno eseguti nuovamente. Il tipo di informazione che il nostro parametro puo’ contenere sara’ quella di un testo, numero, una data, un file, un oggetto del nostro database oppure un option set.

Creato il nostro parametro saremo in grado di utilizzarlo nel front end attraverso la sezione Condition di qualsiasi elemento del design e selezionando l’espressione Get data from page url

e per concludere completiamo la nostra espressione nella sezione Condition con la quale vogliamo che il colore del nostro gruppo A diventi rosso quando il parametro url Key ha un valore uguale ad “a”

Il parametro url puo’ contenere anche informazioni relative ad un oggetto del nostro database

Dopo aver selezionato questo tipo di valore saremo in grado di ultimare l’espressione utilizzando il campo “unique id” per l’elemento all’interno del database

L’impostazione di tali parametri e’ una funzionalita’ base di Bubble.io che i permette di richiamare e salvare qualsiasi tipo di informazione all’interno del url del nostro browser permettendoci di creare UX e manipolazioni delle info sempre piu’ complesse all’interno della nostra applicazione.

Ecosistema No-Code

Share the Post:

Online Bubble Bootcamp

Il primo corso completo in italiano per imparare ad utilizzare Bubble.io software di programmazione visuale per creare applicazioni web e mobile