Mostrare il conteggio in tempo reale dei campi ripetitori nel modulo

Si desidera visualizzare un conteggio in tempo reale di quante righe di campi ripetitori sono state aggiunte al modulo? Questo può essere utile quando si vuole che gli utenti vedano quanti elementi hanno inserito, soprattutto in scenari come l'aggiunta di nomi, attività o articoli di prodotti.

In questo tutorial, vi spiegheremo come aggiornare automaticamente un campo "Conteggio" in tempo reale, utilizzando un semplice snippet PHP.

Nota: questa esercitazione prevede l'aggiunta di PHP e JavaScript. Se avete bisogno di aiuto per aggiungere snippet al vostro sito, consultate questa guida sull'aggiunta di codice personalizzato per WPForms.

Creazione del modulo

Per iniziare, creare il modulo e includere un campo Ripetitore insieme a un campo Testo a riga singola con un'etichetta del tipo "Conteggio". Questo campo verrà aggiornato automaticamente e non dovrà essere compilato manualmente dall'utente.

Se avete bisogno di aiuto per creare un modulo, consultate il nostro tutorial sulla creazione del vostro primo modulo.

Aggiunta dello snippet di codice

Utilizzate il seguente snippet per abilitare la funzione di conteggio in tempo reale sul vostro modulo.

Personalizzazione dello snippet di codice

È necessario aggiornare i seguenti ID nello snippet per adattarli al proprio modulo:

  • wpforms-5410-field_1-container: Sostituire 5410 con il vostro attuale ID modulo e field_1 con il vostro ID campo ripetitore.
  • wpforms-5410-field_3: Sostituire field_3 con il vostro Conteggio ID campo.

Per individuare gli ID dei moduli e dei campi, consultare questa guida.

Una volta aggiunto questo snippet e aggiornati gli ID, il campo Conteggio si aggiornerà automaticamente quando gli utenti aggiungeranno o rimuoveranno righe dal ripetitore.

Ed ecco fatto! Ora avete aggiunto un contatore dinamico al vostro campo ripetitore, offrendo agli utenti una chiara panoramica del numero di inserimenti effettuati.