Comment gérer la soumission du formulaire?

13

Je suis nouveau sur wordpress et donc confronté à certains problèmes.

Le scénario de cas d'utilisation est le suivant:

  1. Un utilisateur affiche un formulaire de demande pour créer un club dans son école.
  2. L'utilisateur remplit le formulaire et clique sur le bouton «Soumettre».
  3. Le formulaire doit être validé.
  4. Si la validation réussit, les données sont stockées dans une table personnalisée club_detailsdans db et l'utilisateur reçoit un message (par exemple: Merci pour la soumission. Votre demande est envoyée à l'administrateur pour approbation.) Sinon des messages d'erreur appropriés sont affichés à l'utilisateur.
  5. L'administrateur se rend sur le panneau d'administration de Wordpress pour approuver les demandes en attente pour le club. (Les données sont extraites de db et montrées à l'administrateur).

J'ai fait ce qui suit:

  • pour 1) J'ai créé un formulaire / une page d'application à l'aide de l'éditeur HTML Wordpress.
  • pour 3) J'ai un fichier javascript ( validation.js) qui a le code de validation.
  • pour 4) J'ai un fichier php ( club-functions.php) qui a une fonction storeInDB()pour stocker les détails de l'application dans un tableau personnalisé en db.
  • pour 5) J'ai créé mon propre dossier de plugins et ajouté un fichier php ( club.php) qui affiche les détails de l'application à l'administrateur sur le panneau d'administration de Wordpress.

Je suis coincé à l'endroit suivant: Comment gérer la soumission du formulaire. Où dois-je placer le code qui appelle la fonction de validation du javascript et appelle ensuite la storeInDB()fonction.

Veuillez me fournir quelques suggestions sur la façon d'y parvenir et cette approche est-elle bonne? Merci beaucoup d'avance.

Pooja
la source

Réponses:

13

Vous devez utiliser la wp_ajaxou la wp_ajax_noprivfonction.

Tout d'abord, vous devez mettre l'URL admin ajax comme valeur d'attribut d'action dans le formulaire de soumission.

<form id="" action="<?php echo admin_url('admin-ajax.php'); ?>" method="post" class="form" >

De cette façon, le formulaire sera soumis par défaut à admin-ajax.php (sans JavaScript). Vous pouvez utiliser JavaScript pour le faire fonctionner en utilisant AJAX.

Vient ensuite la fonction qui utilisera les données soumises. À l'intérieur du formulaire, mettez une wp_nonce_fieldet une entrée cachée avec l'action de nom. Ma valeur d'action est add_transfer.

<?php wp_nonce_field('add_transfer','security-code-here'); ?>
<input name="action" value="add_transfer" type="hidden">

Vous pouvez mettre la fonction qui gérera ce formulaire dans le fichier functions.php ou dans votre fichier plugin. Vous pouvez utiliser wp_ajax_+ le nom de l'action s'il s'agit d'un formulaire uniquement pour les utilisateurs connectés. Pour les utilisateurs non connectés, utilisez wp_ajax_noprivplutôt le nom de l'action.

add_action('wp_ajax_add_transfer', 'process_add_transfer');

function process_add_transfer() {
if ( empty($_POST) || !wp_verify_nonce($_POST['security-code-here'],'add_transfer') ) {
    echo 'You targeted the right function, but sorry, your nonce did not verify.';
    die();
} else {
    // do your function here 
    wp_redirect($redirect_url_for_non_ajax_request);
}
ifdion
la source
Merci ifdion pour la réponse. Je crée le formulaire dans 'Wordpress HTML editor'. Alors, est-il bon d'inclure du code php dans le formulaire car je devrai installer le plugin 'Exec-PHP' qui, je crois, est une exagération? Veuillez partager vos pensées.
Pooja
Remplacez simplement la valeur de l'action par your-site-url.com/wp-admin/admin-ajax.php .
ifdion
Est-ce que ça marche?
ifdion
1
existe-t-il un bon moyen d'obtenir le même résultat mais sans admin-ajax.php?
Tahir Yasin
1
@TheWPNovice Je suppose qu'il est toujours dans le /wp-admin/répertoire. Notez que vous n'avez pas besoin de modifier ou d'ajouter quoi que ce soit dans ce fichier.
ifdion
2

tout d'abord, permettez-moi de vous dire que la validation javascript fonctionne côté client. donc si l'utilisateur désactive js, vous allez avoir des problèmes.

vous devez donc également valider les valeurs d'entrée, côté serveur.

dans cet esprit:

Le code js peut être appelé directement à partir de la page où se trouve le formulaire. L'attribut onsubmit est la façon habituelle de l'appeler.

exemple

<form onSubmit="validateForms()" method="post" action="domain.com/club-contacts">
    <label for="app_email">Application</label>
    <input type="text" name="app_email" id="app_email" value="" />
    <input type="hidden" name="app_application" value="1" />
    <input type="submit" name="app_form_send" value="Send" />
</form>

page.php

Cela peut également être votre page de modèle personnalisée ou single.php. dans ce cas, 99 est l'ID de la page spécifique que vous souhaitez indiquer à l'utilisateur si elle a été approuvée ou contient une erreur.

if ( get_the_ID() == '99' ) {
  // lets validate the input
  if( !empty($_POST['app_application']) && $_POST['app_application'] == "1"  ) {
   if(!empty($_POST['app_email'])) {
    // check the codex for [Data_Validation][1]
    }
  }
}
pcarvalho
la source
Merci peteroak pour la réponse. Où puis-je appeler du code PHP pour poursuivre le traitement des données du formulaire?
Pooja
l'attribut action pointera vers un fichier. dans ce fichier, vous pouvez filtrer et valider votre formulaire. je mettrai à jour ma réponse pour l'inclure.
pcarvalho