Select ajax into select ajax

Question

Goodmorning, i have this problem: i have a select with ajax that works, but when i call the other select ajax (state - region - city type) only the first dropdown works, while the other one doesn't. Why?

Thank you for your help!

Main page code:

<br>
<h2 class="title title--h3">Scegli una delle due opzioni</h2>

<div class="case-item">
<form>
  <select name="users" onchange="showUser(this.value)">
    <option class="title title--h3" value="1"><strong>Conosco il modello del condizionatore</strong></option>
    <option class="title title--h3" value="2"><strong>Conosco i mq della macchina</strong></option>
  </select>
</form>
<br>
<div id="txtHint">
</div>
</div>

<script>
function showUser(str) {
  if (str == "") {
  document.getElementById("txtHint").innerHTML = "";
  return;
  } else {
  var xmlhttp = new XMLHttpRequest();
  xmlhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
    document.getElementById("txtHint").innerHTML = this.responseText;
    }
  };
  xmlhttp.open("GET","conf_new_SceltaMacchina.php?q=" + str,true);
  xmlhttp.send();
  }
}
</script> 

Second page code (conf_new_SceltaMacchina.php):

<form action="processNewConf.php" method="post" enctype="multipart/form-data">

  <div class="case-item">
      <h2 class="title title--h3">Riferimento impianto</h2>
      <input type="text" class="input input__icon form-control" required name="riferimento" placeholder="Inserire qui un riferimento per questo progetto">
      <div class="help-block with-errors"></div>
      <br>
      <br>
      <br>
      <h2 class="title title--h3">I valori del tuo condizionatore</h2>
      <br>

<?
$q = intval($_GET['q']);

if ($q == 1 ) {
  include ('SceltaPlenum_lite.php');
} elseif ($q == 2) {
   echo "<div class=\"row\">";
   echo "<div class=\"form-group col\">";
   echo "<div class=\"contact-block__item\">I metri cubi/ora della tua macchina</div>";
   echo "<input type=\"number\" class=\"input input__icon form-control\" name=\"metricubi\" required placeholder=\"mc/h\">";
   echo "<div class=\"help-block with-errors\"></div>";
   echo "</div>";
   echo "</div>";
   echo "<br>";
}
?>

    <h2 class="title title--h3">I ricambi d'aria necessari</h2>
    <div class="row">
      <div class="col">
        <input name="ric" id="ric" type="radio" required value="5">
        <label>
        <div class="contact-block__item">5 ricambi/ora</div>
        </label>
      </div>
      <div class="col">
        <input name="ric" id="ric" type="radio" value="6">
        <label>
        <div class="contact-block__item">6 ricambi/ora</div>
        </label>
      </div>
      <div class="col">
        <input name="ric" id="ric" type="radio" value="7">
        <label>
        <div class="contact-block__item">7 ricambi/ora</div>
        </label>
      </div>
    </div>
    <br>
    <h2 class="title title--h3">Esposizione principale</h2>
    <div class="row">
      <div class="col">
        <input name="esp" id="esp" type="radio" required value="0">
        <label>
        <div class="contact-block__item">Nord</div>
        </label>
      </div>
      <div class="col">
        <input name="esp" id="esp" type="radio" value="1">
        <label>
        <div class="contact-block__item">Sud</div>
        </label>
      </div>
      <div class="col">
        <input name="esp" id="esp" type="radio" value="2">
        <label>
        <div class="contact-block__item">Ovest</div>
        </label>
      </div>
      <div class="col">
        <input name="esp" id="esp" type="radio" value="3">
        <label>
        <div class="contact-block__item">Est</div>
        </label>
      </div>
    </div>
    <br>
    <h2 class="title title--h3">Numero di stanze da condizionare con la macchina scelta</h2>
    <div class="row">
      <div class="col">
        <select onchange="showUser(this.value,'st')" required name="st">
          <option value="1">1 Stanza</option>
          <option value="2">2 Stanze</option>
          <option value="3">3 Stanze</option>
          <option value="4">4 Stanze</option>
          <option value="5">5 Stanze</option>
          <option value="6">6 Stanze</option>
        </select>
      </div>
    </div>
  <br>
  <h2 class="title title--h3">La marca delle bocchette che vorrai utilizzare</h2>
  <div class="row">
    <div class="col">
      <input name="marca" id="marca" type="radio" required value="1">
      <label>
      <div class="contact-block__item">FCR</div>
      </label>
    </div>
    <div class="col">
      <input name="marca" id="marca" type="radio" value="2">
      <label>
      <div class="contact-block__item">Brofer</div>
      </label>
    </div>
  </div>
    <br>
    <button class="btn" type="submit" name="save">Conferma e prosegui</button>
  </form>
</div>

<!-- JavaScripts -->
<script src="assets/js/jquery-3.4.1.min.js"></script>
<script src="assets/js/plugins.min.js"></script>
  <script src="assets/js/common.js"></script>

<!-- Mapbox init -->
<script src="assets/js/mapbox.init.js"></script>

Third page code (SceltaPlenum_lite.php)

<?php
session_start();
$idOrd = $_SESSION['Order__ID'];
include_once 'select.class.php';
$opt = new SelectList();
?>

Seleziona la marca:<br />
<select id="regioni">
<? echo $opt->ShowRegioni() ?>
</select>
<br /><br />
Seleziona la tipologia:<br />
<select id="province">
<option>Scegli...</option>
</select>
<br /><br />
Seleziona il modello:<br/>
<select name="comuni" id="comuni">
<option>Scegli...</option>
</select>

<br /><br />
<br /><br />

<script type="text/javascript">
$(document).ready(function(){

  var scegli = '<option value="0">Scegli...</option>';
  var attendere = '<option value="0">Attendere...</option>';

  $("select#province").html(scegli);
  $("select#province").attr("disabled", "disabled");
  $("select#comuni").html(scegli);
  $("select#comuni").attr("disabled", "disabled");


  $("select#regioni").change(function(){
    var regione = $("select#regioni option:selected").attr('value');
    $("select#province").html(attendere);
    $("select#province").attr("disabled", "disabled");
    $("select#comuni").html(scegli);
    $("select#comuni").attr("disabled", "disabled");

    $.post("select.php", {id_reg:regione}, function(data){
      $("select#province").removeAttr("disabled");
      $("select#province").html(data);
    });
  });

  $("select#province").change(function(){
    $("select#comuni").attr("disabled", "disabled");
    $("select#comuni").html(attendere);
    var provincia = $("select#province option:selected").attr('value');
    $.post("select.php", {id_pro:provincia}, function(data){
      $("select#comuni").removeAttr("disabled");
      $("select#comuni").html(data);
    });
  });
});

</script>

select.class.php code:

<?php

class SelectList
{
    
    protected $conn;
    
        public function __construct()
        {
            $this->DbConnect();
        }
    
        protected function DbConnect()
        {
            
    
            $servername = trim('xxx');
            $username = trim('xxx');
            $password = trim('xxx');
            $dbname = trim('xxx');
            $port = trim('xxx');
            
            $this->conn = $conn = mysqli_connect($servername, $username, $password, $dbname, $port) OR die("Impossibile connettersi al database");
            mysqli_select_db($this->conn, $dbname) OR die("Impossibile selezionare il database $dbname");
            return TRUE;
        }
        
        public function ShowRegioni()
        {
            $sql = "SELECT * FROM Cond_Marche";
            $res = mysqli_query($this->conn, $sql);
            $regioni = '<option value="0">scegli...</option>';
            
                while($row = mysqli_fetch_array($res))
                {
                    $regioni .= '<option value="' . $row['id_marca'] . '">' . utf8_encode($row['Marca']) . '</option>';
                }
                
            return $regioni;
        }
        
        public function ShowProvince()
        {
            $sql = "SELECT * FROM Cond_Tipologia WHERE id_marca=$_POST[id_reg]";
            $res = mysqli_query($this->conn, $sql);
            $province = '<option value="0">scegli...</option>';
            
                while($row = mysqli_fetch_array($res))
                {
                    $province .= '<option value="' . $row['id_tipologia'] . '">' . utf8_encode($row['NomeTipologia']) . '</option>';
                }
                
            return $province;
        }
        
        public function ShowComuni()
        {
            $sql = "SELECT * FROM Cond_Modello WHERE id_tipologia=$_POST[id_pro]";
            $res = mysqli_query($this->conn, $sql);
            $comuni = '<option value="0">scegli...</option>';
            
                while($row = mysqli_fetch_array($res))
                {
                    $comuni .= '<option value="' . $row['id_modello'] . '">' . utf8_encode($row['NomeModello']) . ' - '  . $row['MisuraBase'] . " X ". $row['MisuraAltezza'] .'</option>';
                }
                
            return $comuni;
        }
}

?> 

select.php code:

<?php

include_once 'select.class.php';
$opt = new SelectList();

if(isset($_POST['id_reg']))
{
    echo $opt->ShowProvince();
    die;
}

if(isset($_POST['id_pro']))
{
    echo $opt->ShowComuni();
    die;
}


?> ```

---

Update: if i use the page as single, it works perfectly. Any ideas?