Esercitazione: Applicazione di regole ai campi del modulo adattivo tutorial-apply-rules-to-adaptive-form-fields

CAUTION
AEM 6.4 ha raggiunto la fine del supporto esteso e questa documentazione non viene più aggiornata. Per maggiori dettagli, consulta la nostra periodi di assistenza tecnica. Trova le versioni supportate qui.

06-apply-rules-to-adaptive-form_main

Questa esercitazione è un passaggio nel Creare il primo modulo adattivo serie. Adobe consiglia di seguire le serie in sequenza cronologica per comprendere, eseguire e illustrare il caso d’uso completo dell’esercitazione.

Informazioni sull’esercitazione about-the-tutorial

Puoi utilizzare le regole per aggiungere interattività, logica di business e convalide avanzate a un modulo adattivo. I moduli adattivi dispongono di un editor di regole integrato. L’editor di regole fornisce una funzionalità di trascinamento della selezione, simile alle visite guidate. Il metodo di trascinamento della selezione è il metodo più veloce e facile per creare regole. L'editor di regole fornisce anche una finestra di codice per gli utenti interessati a testare le proprie capacità di codifica o a portare le regole al livello successivo.

Per ulteriori informazioni sull’editor di regole, consulta Editor di regole Forms adattivo.

Al termine dell’esercitazione, imparerai a creare regole per:

  • Richiamare un servizio Form Data Model per recuperare i dati dal database
  • Richiamare un servizio Form Data Model per aggiungere dati al database
  • Esegui un controllo di convalida e visualizza messaggi di errore

Le immagini interattive di GIF alla fine di ogni sezione dell’esercitazione consentono di apprendere e convalidare al volo la funzionalità del modulo che si sta creando.

Passaggio 1: Recupera un record cliente dal database retrieve-customer-record

È stato creato un modello dati modulo seguendo la procedura descritta di seguito creare un modello dati modulo articolo. Ora è possibile utilizzare l’editor di regole per richiamare i servizi Forms Data Model per recuperare e aggiungere informazioni al database.

A ogni cliente viene assegnato un numero ID cliente univoco, che consente di identificare i dati cliente rilevanti in un database. La procedura seguente utilizza l'ID cliente per recuperare le informazioni dal database:

  1. Apri il modulo adattivo per la modifica.

    http://localhost:4502/editor.html/content/forms/af/change-billing-shipping-address.html

  2. Tocca ID cliente e tocca Modifica regole icona. Viene visualizzata la finestra Editor regole.

  3. Tocca + Crea per aggiungere una regola. Apre l'Editor visivo.

    Nell'Editor visivo, la QUANDO istruzione è selezionata per impostazione predefinita. Inoltre, l'oggetto modulo (in questo caso, ID cliente) da dove hai avviato l'editor di regole viene specificato nella sezione QUANDO istruzione.

  4. Tocca Seleziona stato a discesa e seleziona viene modificato.

    quando customeridischanged

  5. In POI istruzione, seleziona Richiama servizio dal Seleziona azione a discesa.

  6. Seleziona la Recupera indirizzo di spedizione dal servizio Seleziona a discesa.

  7. Trascina e rilascia la ID cliente dalla scheda Oggetti modulo al campo Rilascia oggetto o seleziona qui nel campo INGRESSO scatola.

    dropobjectstoinputfield-retrievedata

  8. Trascina e rilascia la ID cliente, nome, indirizzo di spedizione, stato e codice postale dalla scheda Oggetti modulo al campo Rilascia oggetto o seleziona qui nel campo USCITA scatola.

    dropobjectstooutputfield-retrievedata

    Tocca Fine per salvare la regola. Nella finestra dell’editor delle regole, tocca Chiudi.

  9. Visualizzare l’anteprima del modulo adattivo. Immetti un ID nel ID cliente campo . Il modulo ora può recuperare i dettagli dei clienti dal database.

    recupero-informazioni

Passaggio 2: Aggiungi l'indirizzo cliente aggiornato al database updated-customer-address

Una volta recuperati i dettagli del cliente dal database, puoi aggiornare l’indirizzo di spedizione, lo stato e il codice postale. La procedura seguente richiama un servizio Form Data Model per aggiornare le informazioni dei clienti al database:

  1. Seleziona la Invia e tocca Modifica regole icona. Viene visualizzata la finestra Editor regole.

  2. Seleziona la Invia - Fai clic e tocca Modifica icona. Vengono visualizzate le opzioni per modificare la regola di invio.

    regola di invio

    Nell’opzione WHEN (QUANDO), la Invia e è selezionato le opzioni sono già selezionate.

    invia con un clic

  3. In POI , tocca + Aggiungi istruzione opzione . Seleziona Richiama servizio dal Seleziona azione a discesa.

  4. Seleziona la Aggiorna indirizzo di spedizione dal servizio Seleziona a discesa.

    indirizzo di spedizione-aggiornamento

  5. dropobjectstoinputfield-updatedata

    Trascina e rilascia la Indirizzo di spedizione, Stato e CAP dalla scheda Oggetti modulo alla corrispondente proprietà .nome tabella (ad esempio, customerdetails .shippingAddress) della Rilascia oggetto o seleziona qui nel campo INGRESSO scatola. Tutti i campi con prefisso nome tabella (ad esempio, dettagli cliente in questo caso d’uso) fungono da dati di input per il servizio di aggiornamento. Tutto il contenuto fornito in questi campi viene aggiornato nell’origine dati.

    note note
    NOTE
    Non trascinare il Nome e ID cliente alla corrispondente tablespace.property (ad esempio, customerdetails.name). Aiuta ad evitare di aggiornare per errore nome e ID del cliente.
  6. Trascina e rilascia la ID cliente dalla scheda Oggetti modulo al campo id nel campo INGRESSO scatola. I campi senza nome tabella prefisso (ad esempio, dettagli cliente in questo caso d’uso) fungono da parametro di ricerca per il servizio di aggiornamento. La id in questo caso d’uso identifica in modo univoco un record nella tabella dei dettagli del cliente.

  7. Tocca Fine per salvare la regola. Nella finestra dell’editor delle regole, tocca Chiudi.

  8. Visualizzare l’anteprima del modulo adattivo. Recupera i dettagli di un cliente, aggiorna l’indirizzo di spedizione e invia il modulo. Quando recuperi nuovamente i dettagli dello stesso cliente, viene visualizzato l'indirizzo di spedizione aggiornato.

Passaggio 3: (sezione Bonus) Utilizza l’editor di codice per eseguire convalide e visualizzare messaggi di errore step-bonus-section-use-the-code-editor-to-run-validations-and-display-error-messages

È necessario eseguire la convalida del modulo per verificare che i dati immessi nel modulo siano corretti e che venga visualizzato un messaggio di errore in caso di dati errati. Ad esempio, se nel modulo viene immesso un ID cliente non esistente, deve essere visualizzato un messaggio di errore.

I moduli adattivi forniscono diversi componenti con convalide integrate, ad esempio campi e-mail e numerici da utilizzare in casi d’uso comuni. Utilizza l'editor di regole per i casi d'uso avanzati, ad esempio, per visualizzare un messaggio di errore quando il database restituisce zero (0) record (nessun record).

La procedura seguente mostra come creare una regola per visualizzare un messaggio di errore se l’ID cliente immesso nel modulo non esiste nel database. La regola inoltre attiva e reimposta il campo ID cliente . La regola utilizza API dataIntegrationUtils del servizio del modello dati del modulo per verificare se l'ID cliente esiste nel database.

  1. Tocca ID cliente e tocca Edit Rules icona. Viene visualizzata la finestra Editor regole.

  2. Tocca + Crea per aggiungere una regola. Apre l'Editor visivo.

    Nell'Editor visivo, la QUANDO istruzione è selezionata per impostazione predefinita. Inoltre, l'oggetto modulo (in questo caso, ID cliente) da dove hai avviato l'editor di regole viene specificato nella sezione QUANDO istruzione.

  3. Tocca Seleziona stato a discesa e seleziona viene modificato.

    quando customeridischanged

    In POI istruzione, seleziona Richiama servizio dal Seleziona azione a discesa.

  4. Passa da Editor visivo a Editor di codice. Il controllo dell'interruttore si trova sul lato destro della finestra. Viene aperto l’Editor di codice, con codice simile al seguente:

    editor di codice

  5. Sostituisci la sezione della variabile di input con il seguente codice:

    code language-none
    var inputs = {
        "id" : this
    };
    
  6. Sostituisci la sezione guidelib.dataIntegrationUtils.executeOperation (operationInfo, input, output) con il seguente codice:

    code language-none
    guidelib.dataIntegrationUtils.executeOperation(operationInfo, inputs, outputs, function (result) {
      if (result) {
          result = JSON.parse(result);
        customer_Name.value = result.name;
        customer_Shipping_Address = result.shippingAddress;
      } else {
        if(window.confirm("Invalid Customer ID. Provide a valid customer ID")) {
              customer_Name.value = " ";
             guideBridge.setFocus(customer_ID);
        }
      }
    });
    
  7. Visualizzare l’anteprima del modulo adattivo. Immetti un ID cliente errato. Viene visualizzato un messaggio di errore.

    display-validation-error

recommendation-more-help
a6ebf046-2b8b-4543-bd46-42a0d77792da