Comment utiliser la méthode onsubmit pour soumettre les données d'un formulaire en PHP

Dans le développement front-end, il existe de nombreuses façons de soumettre les données d'un formulaire au serveur back-end. Parmi elles, la méthode la plus courante consiste à utiliser la méthode onsubmit du formulaire pour effectuer l'opération de soumission. Cet article expliquera comment utiliser la méthode onsubmit pour soumettre des données de formulaire en PHP et donnera quelques exemples pour aider les lecteurs à approfondir leur compréhension.

1. Introduction de base

Pour utiliser la méthode onsubmit en PHP, vous devez ajouter un événement onsubmit à la balise form et appeler une fonction JavaScript. L'événement

onsubmit est déclenché lorsque le formulaire est soumis. Si la saisie du formulaire est valide, l'événement onsubmit retournera vrai, indiquant que la soumission est réussie. Sinon, false sera renvoyé, indiquant que la soumission a échoué. Afin de garantir l'exactitude et l'exhaustivité des données du formulaire, les données du formulaire sont généralement vérifiées et traitées avant d'être soumises au serveur backend.

2. Étapes de mise en œuvre

Voici plusieurs étapes pour utiliser la méthode onsubmit pour soumettre les données du formulaire :

1. Créez un formulaire HTML contenant les données qui doivent être soumises.
2. Ajoutez un événement onsubmit à l'élément de formulaire et spécifiez la fonction JavaScript à appeler.
3. La fonction JavaScript sera appelée lorsque le formulaire sera soumis, récupérera les données du formulaire et les enverra au serveur backend.

3. Exemple d'analyse

Ce qui suit utilise un exemple pour démontrer l'utilisation de la méthode onsubmit. Supposons que nous ayons le formulaire HTML suivant :

<form method="post" action="submit.php" onsubmit="return validateForm()">
  <label for="name">姓名：</label>
  <input type="text" id="name" name="name">
  <br>
  <label for="email">电子邮件：</label>
  <input type="email" id="email" name="email">
  <br>
  <input type="submit" value="提交">
</form>

Ce formulaire contient deux zones de saisie, une pour le nom et une pour l'e-mail. Dans l'événement onsubmit du formulaire, nous appelons une fonction JavaScript nommée validateForm pour vérifier la validité des données du formulaire. Cette fonction renvoie vrai si les données du formulaire sont validées, sinon elle renvoie faux. Voici le code d'implémentation de cette fonction :

function validateForm() {
  let name = document.getElementById("name").value.trim();
  let email = document.getElementById("email").value.trim();

  if (name === "" || email === "") {
    alert("请输入姓名和电子邮件");
    return false;
  } else if (!email.match(/^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/)) {
    alert("请检查电子邮件格式");
    return false;
  } else {
    return true;
  }
}

Cette fonction obtient d'abord le nom et l'e-mail dans la zone de saisie. Ensuite, il valide les deux champs. Si la valeur dans la zone de saisie est vide, cette fonction fera apparaître une boîte de dialogue invitant l'utilisateur à saisir son nom et son adresse e-mail. Si le format de l'e-mail est incorrect, une boîte de dialogue apparaîtra également. Sinon, cette fonction renvoie vrai.

Notez que le résultat renvoyé par cette fonction est déterminé avant la soumission du formulaire. Si cette fonction renvoie vrai, les données du formulaire seront soumises à l'URL spécifiée dans l'attribut action. Sinon, les données du formulaire ne seront pas soumises.

Une fois que le serveur backend a reçu les données du formulaire, il peut les traiter en conséquence. Le code pour soumettre les données du formulaire peut être écrit dans le fichier submit.php :

<?php
  $name = $_POST["name"];
  $email = $_POST["email"];

  echo "您的姓名是 " . $name;
  echo "您的电子邮件是 " . $email;
?>

Ce code est très simple, il récupère simplement le nom et l'e-mail soumis, puis les affiche à l'écran. Bien entendu, dans les applications réelles, des opérations plus complexes peuvent être réalisées.

IV. Conclusion

Cet article présente comment utiliser la méthode onsubmit pour soumettre des données de formulaire en PHP et donne un exemple pour illustrer les étapes spécifiques de mise en œuvre. Grâce à l'introduction de cet article, les lecteurs peuvent maîtriser l'utilisation de base de la méthode onsubmit, afin de mieux mettre en œuvre la soumission et la vérification des formulaires.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!