Javascript 提交时调用php函数，如果可能，不使用jQuery

我有一个数据库，里面有关于大坝的数据。我每年有一个大坝的数据。我调用我的数据库来获取数据集，它就工作了。 但现在我只想选择一年的数据

我在php中有一个连接到数据库的函数。我想在提交表格时调用它（带有年份选择）

我想我必须使用AJAX。但是我的“xhr.open（'GET'，…）”行没有执行该函数。我不知道在addEventListener中放什么，因为我的php没有返回任何内容

我不使用jQuery，所以我正在寻找一种方法来调用我的php函数，如果可能的话，不使用它

这是我的密码：

map.js

//AJAX pour appeler la fonction PHP connectBDD()
//envoie de la requête

var xhr = new XMLHttpRequest();
xhr.open('GET',"connexion.php?anneeSelectionnee='2016'");
xhr.send(null);

//reception des données
listAnnees = document.getElementById('annee');
if (listAnnees){
listAnnees.addEventListener('change',function(event){
  if (xhr.readyState == XMLHttpRequest.DONE) {
      alert(xhr.responseText);  //according to  Gerars Cuadras comment
    event.preventDefault();
    console.log("Oui oui je suis là");
    //supprimer_ouvrages();
}
});

我没有显示我的php文件“connexion.php”，因为它是一个简单的数据库connexion，然后调用javascript函数在地图上绘制水坝。（最初是在文件中的connectBDD（）函数中，但我不知道如何在AJAX中调用函数而不是文件）

index.php
2017
2016
2015

其他尝试

我也尝试过不使用AJAX，它可以工作（调用php函数），但是每次都要重新加载页面，所以我的选择失败了。。（使用connectBDD（）连接connexion.php中的所有代码）

2017
2016
2015
如果（isset（$_POST[‘特使’]））{
?>
供应量；
,'','','','');
创建列表（）；

---

如果我可以将'xhr.open（'GET'，..）与PHP函数而不是PHP文件一起使用，我想知道诀窍：）

如果有人需要，这里有一个解决方案：

我的PHP函数没有返回任何内容，因为它直接调用Javascript函数。这对于AJAX来说是个问题，而且非常糟糕，因为我在服务器端进行所有计算

@Lou建议划分工作。然后我只使用PHP函数连接数据库并返回数据。然后调用所需的javascript函数

使用此方法，我的AJAX调用工作正常：

对所有内容进行分组的javascript函数：

在我的PHP连接文件中，我只保留连接：

   $host_bdd='something';
   $name_bdd='something';
   $user_bdd='something';
   $pass_bdd='something';

   try{
      $bdd = new PDO ("pgsql:host=".$host_bdd.";dbname=".$name_bdd."", "".$user_bdd."", "".$pass_bdd."") or die(print_r($bdd->errorInfo()));
      $bdd->exec("SET NAMES utf8");
      $bdd->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_WARNING);
    }

   catch(Exeption $e){
      die("Erreur!".$e->getMessage());
   };


   $reponse = $bdd->query('SELECT * FROM ouvrages');

   $outp = array();
   $outp = $reponse->fetchAll();
   echo json_encode($outp); //here I return my result as JSON

希望它能帮助某人：）

  <form action="index.php"> 
  <select name="annee" id="annee">
    <option value="2017">2017</option>
    <option value="2016">2016</option>
    <option value="2015">2015</option>
  </select>
  <input type="submit" id="envoyer" name="envoyer" value="Changement d'années">
</form>


if (isset($_POST['envoyer'])) {
  ?>
  <script type="text/javascript">
  supprimer_ouvrages();
  </script>
  <?php
    connectBDD('2016');
}

<script type="text/javascript" src="l93_to_wgs84.js"></script>
<script type="text/javascript" src="dictionnaryFunctions.js"></script>

<?php
//script de connection à la base de données et de récupération des informations


function connectBDD($anneeSelectionnee){
  echo 'Code is executed !'

    //connexion a la base de donnees
   $host_bdd='localhost';
   $name_bdd='smthg';
   $user_bdd='smthg';
   $pass_bdd='smthg';

   try{
      $bdd = new PDO ("pgsql:host=".$host_bdd.";dbname=".$name_bdd."", "".$user_bdd."", "".$pass_bdd."") or die(print_r($bdd->errorInfo()));
      $bdd->exec("SET NAMES utf8");
      $bdd->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_WARNING);
    }

   catch(Exeption $e){
      die("Erreur!".$e->getMessage());
   };

   //connexion réussie
   ?>
   <script type="text/javascript">
    attenteConnexion(1);
    </script>
    <?php


  // On récupère les données
  //on ne prend que les données du cours d'eau qui nous intéresse
   $reponse = $bdd->query('SELECT * FROM ouvrages');

  //On affiche chaque entrée une à une
  while ($donnees = $reponse->fetch())
  {
    //on remplace les "_" par des espaces pour une meilleure lisibilité
    $donnees = str_replace("_"," ",$donnees);
    //coordonnees de l'ouvrage
    $latitude = $donnees['xl93'];
    $longitude = $donnees['yl93'];

    $impact = $donnees['impact'];

    //toutes les informations que l'on souhaite afficher dans la fiche d'identité
    //si on veut afficher une informations supplémentaire, c'est dans ce tableau qu'il faut ajouter une ligne
    $identite = array(
      'Nom' => $donnees['nom'],
      'ROE' => $donnees['idroe'],
      'Commune' => $donnees['commune'],
      'Syndicat' => $donnees['syndicat'],
      'Projet' => $donnees['projet'],
      'Type d\'ouvrage' => $donnees['typeouvr'],
      'Sous-type d\'ouvrage' => $donnees['sstypeouvr'],
      'Passe à poisson' => $donnees['passepoiss'],
      'Système de montaison' => $donnees['systmont'],
      'Système de dévalaison' => $donnees['systdev'],
      'Usage' => $donnees['usage'],
      'Présence d usage' => $donnees['presenceus'],
      'Etat' => $donnees['etat'],
      'Mort par dévalaison (%)' => $donnees['mortdeval'],
      'Franchissabilité à la montaison' => $donnees['franchiss'],
      'Année' => $donnees['anneemaj']);

    $courseau = $donnees['courseau'];
    $espece = $donnees['espece'];
    $annee = $donnees['anneemaj'];

    ?>
    <script type="text/javascript">
    creation_ouvrage(lambert93toWGPS('<?PHP echo $latitude;?>','<?PHP echo $longitude;?>')['latitude'],lambert93toWGPS('<?PHP echo $latitude;?>','<?PHP echo $longitude;?>')['longitude'],'<?PHP echo $impact;?>',<?PHP echo json_encode($identite);?>,'<?PHP echo $courseau;?>','<?PHP echo $espece;?>','<?PHP echo $annee;?>','<?PHP echo $anneeSelectionnee;?>');
    </script>

    <?php
  }
  ?>
  <script type="text/javascript">
  creation_liste();
  </script>
  <?php

  $reponse->closeCursor(); // Termine le traitement de la requête
  echo $anneeSelectionnee;

}
    ?>

function afficherDonnees(anneeSelectionnee){
  //on récupère les données de la table ouvrages dans la BDD
  var xmlhttp = new XMLHttpRequest();
  xmlhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
      console.log("connexion réussie ");
      var tableOuvrages = JSON.parse(this.responseText);

      //here I do all the treatments I need on my dataset

};

  xmlhttp.open("GET", "connexion.php", true);
  xmlhttp.send();

}

   $host_bdd='something';
   $name_bdd='something';
   $user_bdd='something';
   $pass_bdd='something';

   try{
      $bdd = new PDO ("pgsql:host=".$host_bdd.";dbname=".$name_bdd."", "".$user_bdd."", "".$pass_bdd."") or die(print_r($bdd->errorInfo()));
      $bdd->exec("SET NAMES utf8");
      $bdd->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_WARNING);
    }

   catch(Exeption $e){
      die("Erreur!".$e->getMessage());
   };


   $reponse = $bdd->query('SELECT * FROM ouvrages');

   $outp = array();
   $outp = $reponse->fetchAll();
   echo json_encode($outp); //here I return my result as JSON