Mes champs ne lisent pas la saisie

Bonjour,

merci d'avance a ceux qui me répondront.
Mon problème doit surement être assez facile a résoudre mais je n'arrive pas a en voir la source.
quand je rentre mes identifiant et mes mot de passe dans les champs et que je valide j'ai le message que j'ai oublier de remplir un champ.
Voici mon code html :

<form action="co.php" method="POST">
                <div class="card wizard-card ct-wizard-orange" id="wizard">
                
                <!--        You can switch "ct-wizard-orange"  with one of the next bright colors: "ct-wizard-blue", "ct-wizard-green", "ct-wizard-orange", "ct-wizard-red"             -->
                
                    	<div class="wizard-header">
                        	<h3><b>Connection</b> <br></h3>
                    	</div>
                    	<ul>
                            <li><a href="#about" data-toggle="tab"></a></li>

                        </ul>
                        <div class="tab-content">
                            <div class="tab-pane" id="about">
                              <div class="row">
                                  
                                  <div class="col-sm-10 col-sm-offset-1">
                                      <div class="form-group">
                                        <label for="exampleInputEmail1">Identifiant</label>
                                        <input type="text" class="form-control" id="id" placeholder="identifiant">
                                      </div>
                                      <div class="form-group">
                                        <label for="exampleInputEmail1">Mot de passe</label>
                                        <input type="text" class="form-control" id="mdp" placeholder="mot de passe">
                                      </div>
                                  </div>
                              </div>
                            </div>

                        </div>
                        <div class="wizard-footer">
                            <input type='submit' class='btn btn-primary' name='connection'/>
                            <div class="clearfix"></div>
                        </div>	
                </div>
                </form>

mon code php:

<?php
  //connection au serveur
  ini_set('display_errors','off');
  $cnx = mysql_connect( "localhost", "root", "" ) ;
 
  //sélection de la base de données:
  $db  = mysql_select_db( "rdv" ) ;
 if(isset($_POST) && !empty($_POST['id']) && !empty($_POST['mdp'])) {
  extract($_POST);
  // on recupère le password de la table qui correspond au login du visiteur
  $sql = "select mdp from telepro where id='".$id."'";
  $req = mysql_query($sql) or die('Erreur SQL !<br>'.$sql.'<br>'.mysql_error());

  $data = mysql_fetch_assoc($req);

  if($data['mdp'] != $pass) {
    echo '<p>Mauvais login / password. Merci de recommencer</p>';
    include('index.html'); // On inclut le formulaire d'identification
    exit;
  }
  else {
    session_start();
    $_SESSION['id'] = $id;
    
    echo 'Vous etes bien logué';
    // ici vous pouvez afficher un lien pour renvoyer
    // vers la page d'accueil de votre espace membres 
  }    
}
else {
  echo '<p>Vous avez oublié de remplir un champ.</p>';
   include('index.html'); // On inclut le formulaire d'identification
   exit;
}

 
 
 ?>

merci de m'aider c'est pour le travail :p