How to submit a form
-
Hi, I’m am a developper and I wonder how to submit my form. I’ve created it in my function.php file that is linked to my template page with a shortcode. The form works, I can fill it, but I can’t verify if it works, I don’t know why. I’m new to wordpress AND ajax and I don’t understand how wordpress manages it. Also, in my template, I have created two script tags (one for the phone number input and the second one to verify the form: the one I think it doesn’t work)). So, my form is visible, fillable, but I try to verify the submission and to save my data in a data table I have also created. Here is what I have done:
functions.php:
function registration_form() { ob_start();?> <form action="" id="registration_form" method="post"> <input class="gauche" name="nom" type="text" placeholder="Nom*" required><input class="droite" name="prenom" type="text" placeholder="Prénom*" required> <input name="mail" type="email" placeholder="E-mail" required> <input name="login" type="text" placeholder="Identifiant*" required> <input class="gauche" name="mdp" type="password" placeholder="Mot de passe*" required><input class="droite" name="mdp2" type="password" placeholder="Confirmez le mot de passe*" required> <input name="societe" type="text" placeholder="Société*" required> <input name="fonction" type="text" placeholder="Fonction*" required> <input name="adresse" type="text" placeholder="Adresse*" required> <input name="complement" type="text" placeholder="Complément d'adresse"> <input name="ville" type="text" placeholder="Ville*" required> <label id="pays">Pays <span style="color: red;">*</span></label> <input class="gauche" name="code" type="text" placeholder="Code postal*"><select class="droite" name="pays" required> <option value="Afghanistan">Afghanistan</option> <option value="Åland Islands">Åland Islands</option> <option value="Albania">Albania</option> </select> <label>Téléphone <span style="color: red;">*</span></label><br> <input id="phone" style="margin-top:5px;" name="telephone" type="text" required><br> <input class="bouton_submit" type="submit" name="user_send_registration" value="S'inscrire" style="background-color:#3498db; color:white; width:100px; height:35px;"> </form> <?php return ob_get_clean(); } add_shortcode( 'register', 'registration_form' );my wordpress page:
<!--my shortcode--> [register] <script> function getIp(callback) { fetch('https://ipinfo.io/json?token=<your token>', { headers: { 'Accept': 'application/json' }}).then((resp) => resp.json()).catch(() => { return { country: 'fr',};}).then((resp) => callback(resp.country));} const phoneInputField = document.querySelector("#phone"); const phoneInput = window.intlTelInput(phoneInputField, { preferredCountries: ["fr", "us", "uk"], utilsScript: "https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.8/js/utils.js",}); </script> <script> $("#registration_form").validate({ rules:{ nom:{required:true}, prenom:{required:true}, mail:{required:true, email:true, emailExt:true}, login:{required:true}, mdp:{required:true}, mdp2:{required:true}, societe:{required:true}, fonction:{required:true}, adresse:{required:true}, complement:{required:false}, ville:{required:true}, code:{required:true}, pays:{required:true}, telephone:{required:true, minlength: 10, maxlength: 15, number: true} }, submitHandler: function(form) { if(isReqInprogress){ return; } $.ajax({ url:"/wp-content/themes/themename/process.php", type: "post", data:$('#registration_form').serialize(), dataType:"JSON", success: function(response) { alert("Your message has been received and we will be contacting you shortly to follow-up."); isReqInprogress = false; } }); } }); </script>And then my process.php file:
<?php define('BLOCK_LOAD', true); require_once( $_SERVER['DOCUMENT_ROOT'] . '/wp-config.php' ); require_once( $_SERVER['DOCUMENT_ROOT'] . '/wp-includes/wp-db.php' ); $wpdb = new wpdb( DB_USER, DB_PASSWORD, DB_NAME, DB_HOST); global $wpdb; $data = $_POST; $form_url = wp_get_referer(); $query = $wpdb->insert('wp_clients_user', array( 'nom' => $data['nom'], 'prenom' => $data['prenom'], 'email' => $data['email'], 'login' => $data['login'], 'mdp' => $data['mdp'], 'societe' => $data['societe'], 'fonction' => $data['fonction'], 'adresse' => $data['adresse'], 'complement_adresse' => $data['complement'], 'code_postal' => $data['code'], 'ville' => $data['ville'], 'pays' => $data['pays'], 'telephone' => $data['telephone'], 'actif' => false ), array( '%s', '%s', '%s', '%s', '%s', '%s', '%s', '%s', '%s', '%d', '%s', '%s', '%d', ) ); if ($query) { $response['error'] = "true"; }else{ $response['error'] = "false"; } echo json_encode($response); // $wpdb->show_errors(); // Redirect user to the welcome page if everything is okay wp_safe_redirect(wp_siteurl); exit(); ?>I forgot to mention it but process.php and functions.php are in the same folder, located at /wp-content/themes/industrial-child/
Thanks for the help.
The topic ‘How to submit a form’ is closed to new replies.