input influye sobre input

[quico5]

Tengo tres inputs, DB, TABLES y CAMPOS, no se como hacer para que el segundo solo funcione cuando el primero tenga una elección, y el tercero solo funcione cuando el segundo tenga una opción, y que solo sea edita-ble un input en cada caso, cuando los tres inputs esten cubiertos quedan bloquedados y se genera el resultado, y si se pulsa el boton, se resetea la pagina

gracyas

Código HTML:

 <?php
                    mysql_connect("localhost","root","root") or die ("Fail connex");
                    mysql_select_db("Northwind") or die ("Fail DB");
                  ?>

        <div class="container">
          <div class="panel panel-default" style="box-shadow:1px 3px 10px 0 black; opacity:1">
            <div class="panel-heading">
              <h3 class="panel-title">Base de Datos</h3>
            </div>
            <div class="panel-body">
              <div class="input-group">
                <form action="index.php" method="GET" style="display:inline; margin-right:-4px;">
                  <input type="text" class="form-control" placeholder="Base de Datos" style="width:33.333333%;" list="bases" autofocus />
                  <datalist id="bases">
                    <?php
                      $result=mysql_query("SHOW DATABASES");

                      while ($row=mysql_fetch_array($result)){
                        echo "<option value='$row[0]' /'>";
                      }
                    ?>
                  </datalist>
                </form>
                <input type="text" class="form-control "placeholder="Tabla" style="width:33.333333%;" list="tablas" />
                <datalist id="tablas">
                  <?php
                    $result=mysql_query("SHOW TABLES FROM Northwind");

                    while ($row=mysql_fetch_array($result)){
                      echo "<option value='$row[0]' /'>";
                    }
                  ?>
                </datalist>
                <input type="text" class="form-control" placeholder="Campo" style="width:33.333333%;" list="campos" />
                <datalist id="campos">
                  <?php
                    $result=mysql_query("SELECT * FROM Customers");

                    while ($row=mysql_fetch_array($result)){
                      echo "<option value='$row[City]' /'>";
                    }
                  ?>
                </datalist>
                <span class="input-group-btn">
                  <button class="btn btn-default" type="button">Borrar</button>
                </span>
              </div><!-- /input-group -->
              <br>
              <div style="border:1px solid #DDD; border-radius:4px; height:300px; overflow:auto;">
                <table class="table">
                  <!--tr><th>Ciudades</th><tr-->

                  <?php
                    $result=mysql_query("SELECT * FROM Customers");

                    while ($row=mysql_fetch_array($result)){
                      echo "<tr>
                              <td>$row[CompanyName]</td>
                              <td>$row[ContactName]</td>
                              <td>$row[ContactTitle]</td>
                              <td>$row[Address]</td>
                              <td>$row[City]</td>
                              <td>$row[Region]</td>
                              <td>$row[PostalCode]</td>
                              <td>$row[Country]</td>
                              <td>$row[Phone]</td>
                              <td>$row[Fax]</td>
                            </tr>";
                    }
                  ?>

                </table>
              </div>
            </div>
          </div>
        </div>