Riassunto AI
Saresti interessato a creare un modulo di valutazione condizionale utilizzando menu a discesa? Con il componente aggiuntivo Sondaggi e Quiz, sei già attrezzato per generare un modulo che raccoglie le opinioni dei visitatori e consente loro di votare vari aspetti.
Tuttavia, ai fini della nostra documentazione, miriamo a progettare un modulo che consenta agli utenti di dare priorità alle funzionalità in base a valori numerici. Dato il sistema numerico per la prioritizzazione, è essenziale impedire numeri di priorità duplicati per diverse funzionalità scelte dai nostri visitatori.
In questo tutorial, costruiremo il nostro modulo di valutazione utilizzando un breve frammento di codice che elimina un numero di priorità se è già stato selezionato. Ciò garantisce che possiamo ottenere decisioni preziose dalle priorità espresse dai nostri clienti.
Creazione del modulo
Iniziamo creando un nuovo modulo e integrando i campi necessari. Il nostro modulo consisterà in un campo Nome, un campo Email opzionale e cinque campi Menu a discesa, ognuno dei quali presenta funzionalità da valutare.
Per assistenza nella configurazione del tuo modulo, non esitare a consultare questa utile guida sulla creazione del tuo modulo iniziale.
Impostazione delle opzioni del campo Menu a discesa
Ora, per i nostri campi Menu a discesa, dovremo esaminarne ciascuno e aggiungere il nostro sistema di valutazione. Ai fini di questa documentazione, le nostre valutazioni sono basate numericamente da 1 a 10, dove 1 è l'opzione meno preferita e 10 è la più alta.
Puoi, ovviamente, usare il sistema che funziona meglio per te, sia esso numerico o testuale.
Selezione dello stile del Menu a discesa
Dalla scheda Avanzate del campo Menu a discesa, ricorda di selezionare lo stile Classico per i tuoi campi. Questo è molto importante poiché lo snippet funzionerà solo con questo stile.
Creazione della logica di valutazione condizionale
È ora di aggiungere lo snippet al tuo sito. Se hai bisogno di assistenza su dove e come aggiungere snippet al tuo sito, dai un'occhiata a questo tutorial.
/**
* WPForms Conditional Rating Form
*
* @link https://wpforms.com/developers/how-to-create-a-conditional-rating-form/
*/
function wpf_dev_conditional_dropdown_options( ) {
?>
<script type="text/javascript">
// only run on dropdown fields inside the form ID 2552
jQuery( 'form#wpforms-form-2552 select' ).on( 'change', function() {
jQuery( 'option' ).prop( 'disabled', false);
jQuery( 'select' ).each(function() {
var val = this.value;
jQuery( 'select' ).not(this).find( 'option' ).filter(function() {
return this.value === val;
}).prop( 'disabled', true);
});
}).change();
</script>
<?php
}
add_action( 'wpforms_wp_footer_end', 'wpf_dev_conditional_dropdown_options', 30 );
Questo frammento di codice analizzerà i campi Menu a discesa all'interno del modulo identificato dall'ID 2552. Una volta scelta un'opzione da uno dei campi, quell'opzione particolare diventerà non disponibile per la selezione nei campi rimanenti.
Assicurati di aggiornare l'ID del campo 2552 per corrispondere all'ID del tuo modulo. Se hai bisogno di assistenza per localizzare il tuo ID, fai riferimento a questo tutorial per trovare questi ID specifici.
Ora, man mano che le opzioni vengono selezionate, le vedrai disabilitate negli altri campi.
E questo è tutto! Hai creato con successo un modulo di valutazione condizionale utilizzando i campi Menu a discesa di WPForms. Desideri nascondere condizionalmente il tuo pulsante di invio in base alle risposte fornite nel tuo modulo? Dai un'occhiata al nostro tutorial su Come mostrare condizionalmente il pulsante di invio.
Azione di riferimento
FAQ
D: Come posso reimpostare le opzioni?
R: Se un utente cambia idea su una qualsiasi opzione, tornerà indietro e farà nuove selezioni che reimposteranno quei valori preselezionati.
D: La logica condizionale può essere utilizzata per mostrare e nascondere il menu a discesa?
R: Assolutamente! Puoi usare la Logica Condizionale di WPForms per nascondere tutti i menu a discesa finché non viene fatta una selezione. Dovrai assicurarti che, quando aggiungi questa logica, verifichi e testi la logica necessaria da applicare, ad esempio la Funzionalità 2 è nascosta finché la Funzionalità 1 non è –Seleziona Uno —.
