Ce que je veux, c'est simple.
L'utilisateur peut sélectionner A ou B et en fonction de cela, ils ont des champs différents à remplir.
Je ne peux pas trouver un moyen de faire cela, je n'ai trouvé que un hack pour la version 1.0 (courant est 2.4.6)
5 Réponses :
Cette question aurait dû être affichée sous Page WordPress de pile Initialement. Vous auriez probablement obtenu une réponse plus rapide. :)
Voici la réponse. : D
Je sais que cette question a été posée assez longtemps, mais j'ai également trouvé une solution à ce que je cherchais cela moi-même. Voici donc la réponse à quelqu'un d'autre qui pourrait également rechercher une solution. Le lien indiqué ci-dessous m'a aidé des tonnes.
"Afficher / masquer des champs conditionnellement avec le formulaire de contact 7"
Vous pouvez vérifier cet article de mien, si vous voulez quelque chose de plus que simplement masquer / afficher des éléments: C'est comment avoir des champs conditionnels simulés en CF7 avec JQuery .
pour un échantillon réel de ce que vous pouvez faire, vous pouvez vérifier retour à mon article, l'exemple donné est basé sur l'hypothèse que vous pouvez avoir des conditions complexes dans des cas réels (par exemple: vous vendez. produits pouvant être standard, mais peuvent également être adaptés). Premisse est que vous travaillez en toute sécurité sur votre enfant-thème, donc si vous ne le faites toujours pas, faites-le maintenant! Le code fait référence à une URL de thème de l'enfant ipotique étape 2 : style votre formulaire de contact avec un ensemble de directives CSS approprié. Le mien contient des directives pour gérer les classes I Ajouter via JQuery. Ici, c'est ... étape 3 : écrivez certaines fonctions pour gérer le travail sale. Les miennes prennent soin de vérifier les conditions, affichent / masquer les champs appropriés, les valeurs prédéfinies, les champs de pré-définition de substitution avec des boîtes d'information graduées, affichez un aperçu de la forme du produit. Vous devrez l'enregistrer sous forme étape 4 : Enqueue le jQuery c'est tout.
/ wp-contenu / thèmes / mythème-enfant et à ses sous-répertoires / catalogue et / js dans le domaine my-domain.it . Vous devrez modifier ces valeurs en conséquence à votre installation WordPress. myCatalogue.pdf dans le fichier / catalogue sous-répertoire du thème de votre enfant. Ici, c'est ... cond1.js dans le sous-répertoire / js de notre thème de notre enfant pour le faire fonctionner avec l'exemple donné. Vous devrez également enregistrer quelques .jpg dans le sous-répertoire de votre enfant pour le prévisualisation de la forme du produit pour fonctionner correctement. Et voici le code ... cond1.js fichier sur la page / post ou pages / messages dont vous avez besoin. J'ai préparé le code suivant à ajouter au fonctions.php de votre thème de votre enfant: il suppose que vous mettez le formulaire dans la page ID 1; Changez cela en conséquence à vos besoins. Voici le code ...
Link Seules les réponses sont généralement fronçées car elles sont soumises à une pourriture de liaison, veuillez éditer votre réponse pour inclure les pièces pertinentes de la ressource liée.
Ceci changé avec CF7 4.1 Libération autour du 1/2015. Les détails sur les modifications peuvent être trouvés ici - http://contactform7.com/2015/01/06/ Contact-Form-7-41-Beta /
Code doit ressembler à quelque chose comme ceci - P>
add_filter( 'wpcf7_validate_text', 'your_validation_filter_func', 10, 2 );
add_filter( 'wpcf7_validate_text*', 'your_validation_filter_func', 10, 2 );
function your_validation_filter_func( $result, $tag ) {
$name = $tag['name'];
if ( $name === 'full-address' ) {
$value = isset( $_POST[$name] )
? trim( wp_unslash( strtr( (string) $_POST[$name], "\n", " " ) ) )
: '';
$recipient = isset( $_POST['recipient'] ) ? $_POST['recipient'] : '' ;
if(strlen($value) === 0 && ($recipient == 'Maintenance Inquiries' || $recipient == 'Resident Accounts') ) {
$result->invalidate( $tag, 'Please input address for this inquiry type' );
}
}
return $result;
}
Si vous souhaitez valider correctement vos champs Server côté et ne reposez pas uniquement sur la validation du côté client uniquement (qui est problématique), c'est la bonne manière pour effectuer une validation conditionnelle / supplémentaire sur des champs spécifiques de votre formulaire. +1
Je viens d'écrire un plugin WordPress qui ajoute une logique conditionnelle au formulaire de contact 7.
Le code source est sur github: https://github.com/pwkip / Contact-Form-7-Conditionnel-Champs
Vous pouvez télécharger le plugin dans le référentiel WordPress ici: https://wordpress.org/ Plugins / CF7-Compagnol-champs /
Je viens d'installer ce plugin, ça marche comme un charme!
Les champs conditionnels CF7 par @ Jules-Colle sont une solution géniale évidente.
Toutefois, si vous souhaitez afficher / masquer / masquer / masquer conditionnellement un ou deux champs, l'ajout de certains JS en ligne fonctionne très bien. P>
Voici un exemple de copie du constructeur de formulaire CF7: P>
<label> Your Name (required)
[text* your-name] </label>
<label> Your Email (required)
[email* your-email] </label>
<label> Your Favorite Color
[select drop-down-menu id:FavoriteColorDropDown "Pink" "Red" "Purple" "Other"] </label>
<label id="EnterFavoriteColorLabel"> Please Specify Your Favorite Color
[text favorite-color] </label>
[submit "Send"]
<script language="javascript" type="text/javascript">
// Hide the favorite-color text field by default
document.getElementById("EnterFavoriteColorLabel").style.display = 'none';
// On every 'Change' of the drop down with the ID "FavoriteColorDropDown" call the displayTextField function
document.getElementById("FavoriteColorDropDown").addEventListener("change", displayTextField);
function displayTextField() {
// Get the value of the selected drop down
var dropDownText = document.getElementById("FavoriteColorDropDown").value;
// If selected text matches 'Other', display the text field.
if (dropDownText == "Other") {
document.getElementById("EnterFavoriteColorLabel").style.display = 'block';
} else {
document.getElementById("EnterFavoriteColorLabel").style.display = 'none';
}
}
</script>