Script con JavaScript nei visualizzatori Web

È possibile utilizzare JavaScript per compiere azioni all'interno di un visualizzatore Web, ad esempio per creare i propri comandi di interfaccia utente o utilizzare librerie JavaScript di terze parti per visualizzare calendari interattivi o disegnare grafici. È anche possibile utilizzare JavaScript in un visualizzatore Web e gli script FileMaker per fare in modo che si richiamino a vicenda e si scambino informazioni. Ad esempio, se un utente crea eventi in un calendario interattivo in un visualizzatore Web, JavaScript può richiamare uno script FileMaker per creare un record per ogni evento.

Da JavaScript in un visualizzatore Web a uno script FileMaker

Una volta terminato il caricamento della pagina Web in un visualizzatore Web, JavaScript può richiamare una delle seguenti funzioni per eseguire uno script FileMaker nel file corrente:

Copia 
FileMaker.PerformScriptWithOption ( script, parametro, opzione ); // Il comportamento è identico a quanto sopra quando l'opzione = "0".
FileMaker.PerformScript ( script, parametro );

dove

Ad esempio, una funzione JavaScript per richiamare uno script FileMaker sarà:

Copia 
function performFileMakerScript() { FileMaker.PerformScriptWithOption ( "nome Script FileMaker", "parametro facoltativo", "3" );
}

Si dice che la funzione FileMaker.PerformScriptWithOption() opera in modo asincrono poiché non attende il completamento dello script FileMaker. Pertanto, lo script FileMaker non restituisce un valore alla funzione FileMaker.PerformScriptWithOption() che lo ha richiamato.

Nel momento in cui la funzione FileMaker.PerformScriptWithOption() viene eseguita, lo script FileMaker viene eseguito nel contesto corrente. Pertanto, se il contesto cambia dopo l'inizio dell'esecuzione di JavaScript ma prima che la funzione FileMaker.PerformScriptWithOption() sia richiamata, lo script FileMaker verrà eseguito in un nuovo contesto. Nel frattempo, ad esempio, l'utente o uno script potrebbero passare a un formato o a un record diverso. Per gestire questa possibilità, la funzione FileMaker.PerformScriptWithOption() può utilizzare il parametro facoltativo per trasferire informazioni sul contesto, come il formato e l'ID del record o la chiave primaria del record su cui lo script FileMaker deve agire.

Da uno script FileMaker a JavaScript in un visualizzatore Web

In uno script FileMaker, l'istruzione di script Esegui JavaScript in visualizzatore Web può richiamare una funzione JavaScript e passarle parametri facoltativi. Vedere istruzione di script Esegui JavaScript in visualizzatore Web.

Esempio

Questo esempio illustra come creare semplici elementi di interfaccia utente in un visualizzatore Web, impostarne i valori a quelli memorizzati in una tabella FileMaker, permettere all'utente di modificare i valori nel visualizzatore Web e inviare nuovamente i nuovi valori alla tabella FileMaker.

  1. Creare una tabella ModuloWeb con i seguenti campi Testo:

    • OrigineDatiVisualizzatoreWeb (con memorizzazione globale)

    • Nome

    • Valutazione

    • Colore

    Vedere Definizione delle tabelle del database e Definizione e modifica dei campi.

  2. In un formato basato su ModuloWeb aggiungere un visualizzatore Web con:

    • l'indirizzo Web ModuloWeb::OrigineDatiVisualizzatoreWeb

    • Consentire l'interazione con il contenuto del visualizzatore Web selezionato

    • Consenti a JavaScript di eseguire script FileMaker selezionato

    • il nome oggetto VisualizzatoreWeb

    Vedere Utilizzo dei visualizzatori Web nei formati e Assegnazione di nomi a oggetti.

  3. Sullo stesso formato, aggiungere un oggetto campo per ogni campo del passo 1.

    Vedere Posizionamento e rimozione dei campi da un formato.

  4. Nel modo Usa, aggiungere un record.

    Vedere Aggiunta, duplicazione ed eliminazione dei record.

  5. Nel campo ModuloWeb::OrigineDatiVisualizzatoreWeb, inserire il seguente URL dati:

    Copia 
    data:text/html,
    <html>
        <head>
            <style>
                div { padding-bottom: 0.5em; }
            </style>
        </head>

        <body>
            <div>
                <label for="name">Nome:<br></label>
                <input id="name" type="text" value="default">
            </div>
            <div>
                <label for="rating">Valutazione:<br></label>
                0 <input id="rating" type="range" min="0" max="10"> 10
            </div>
            <div>
                <label for="color">Colore preferito:<br></label>
                <input id="color" type="color">
            </div>
            <button onclick="submitForm()">Invia</button>
        </body>

        <script>
            function submitForm() {
                var name = document.getElementById("name").value;
                var rating = document.getElementById("rating").value; 
                var color = document.getElementById("color").value;
                var param = name + '\n' + rating + '\n' + color;
                FileMaker.PerformScriptWithOption(
                    "Memorizza dati da modulo Web", param, "0"
                ); 
            }

            function setUserData(name, rating, color) {
                document.getElementById("name").value = name; 
                document.getElementById("rating").value = rating; 
                document.getElementById("color").value = color;
            } 
        </script>
    </html>

    Questo URL dati fornisce l'HTML e il JavaScript che il visualizzatore Web carica ogniqualvolta viene visualizzato. Sulla pagina Web viene visualizzato un semplice modulo contenente un nome in un campo Testo, una valutazione compresa tra 0 e 10 selezionata con un cursore, un colore selezionato con un pop-up di selezione colore e un pulsante di invio.

  6. Nell'Area di lavoro script, creare uno script chiamato Imposta Dati Utente nel visualizzatore Web:

    Copia 
    Pausa/continua lo script [ Durata (secondi): ,001 ]
    Esegui JavaScript in visualizzatore Web [Nome oggetto: "VisualizzatoreWeb" ; 
        Nome funzione: "setUserData" ; 
        Parametri: ModuloWeb::Nome, ModuloWeb::Valutazione, ModuloWeb::Colore]

    Vedere Creazione e modifica degli script.

    In FileMaker WebDirect, una breve pausa consente al visualizzatore Web di finire di caricare la pagina Web prima di richiamare la funzione JavaScript setUserData nel visualizzatore Web. Per nascondere il messaggio "Lo script è in pausa" nella barra degli strumenti, è possibile utilizzare l'istruzione di script Mostra/Nascondi barre degli strumenti.

  7. Creare uno script Memorizza dati da modulo Web:

    Copia 
    Imposta variabile [ $jsParameters ; Valore: Get ( ParametroScript )]
    Imposta campo [ ModuloWeb::Nome ; RicavaValore ( $jsParameters ; 1 ) ]
    Imposta campo [ ModuloWeb::Valutazione ; RicavaValore ( $jsParameters ; 2 ) ]
    Imposta campo [ ModuloWeb::Colore ; RicavaValore ( $jsParameters ; 3 ) ]

    Quando l'utente fa clic sul pulsante Invia nel visualizzatore Web, i valori impostati nel modulo Web vengono memorizzati nei campi della tabella ModuloWeb.

  8. Nel modo Formato scheda, aggiungere i trigger di script SuCaricamentoRecord e SuSalvataggioRecord che eseguano l'istruzione di script Imposta Dati Utente nel visualizzatore Web al passo 6 per aggiornare il visualizzatore Web quando i dati dei campi vengono modificati.

    Vedere Definizione o modifica di un pulsante e Impostazione dei trigger di script per i formati.

Nel modo Usa, provare l'esempio impostando i valori nel modulo Web e facendo clic su Invia. A questo punto i valori dei campi Nome, Valutazione e Colore devono corrispondere a quanto impostato nel modulo Web. In alternativa, le modifiche ai dati dei campi sono visualizzate nel visualizzatore Web quando viene salvato il record.

Note 

  • Quando si imposta un visualizzatore Web per eseguire gli script FileMaker, è necessario selezionare l'opzione Consenti a JavaScript di eseguire script FileMaker. Vedere Utilizzo dei visualizzatori Web nei formati. Per sicurezza, se questa opzione non è selezionata, quando si richiama la funzione FileMaker.PerformScriptWithOption() non viene eseguita alcuna operazione.

  • Poiché FileMaker WebDirect è soggetto a una politica sulla stessa origine nei browser Web per motivi di sicurezza, JavaScript in un visualizzatore Web e gli script FileMaker possono richiamarsi a vicenda solo se la pagina Web del visualizzatore Web ha la stessa origine di quella di FileMaker WebDirect. (L'origine di una pagina Web è data da schema URL, nome host e porta ad essa relativi).

  • In FileMaker WebDirect, l'HTML specificato per il visualizzatore Web deve iniziare con "data:text/html," come indicato nell'esempio di cui sopra. In caso contrario, non è possibile richiamare la funzione FileMaker.PerformScriptWithOption().