firefox fills in the password into the username field

Question

This is weird: if i login to my application, ask firefox to save the username/password. Then log out and go back to the login screen, firefox fills in the password inside the username input field, thus rendering it visible!

Any idea what could cause the problem? Here is the html of my form, although i've checked it 10 zillion times.

<form action="<?php echo WWWROOT ?>login/" autocomplete="on" method="post" name="extranetLoginForm" id="extranetLoginForm" >
 <ul id="formlog">
  <li id="liloginfield">
   <label for="loginfield" id="loginfieldlab"><span class="required">
    <img alt="user-icon" src="<?php echo WWWROOT ?>_img/icons/user.png" />
    Mon nom d'utilisateur : <small style="color:#AAA">(prenom.nom)</small></span>
   </label>
   <input id="loginfield" name="loginfield" class="text required ui-corner-all" type="text" tabindex="1" accesskey="l"  />
   <label for="loginfield" class="error" id="error1">
    <img alt="erreur-login" src="<?php echo WWWROOT ?>_img/icons/exclamation.png" />Ce champ est obligatoire, r&eacute;digez comme ceci: prenom.nom</label>
  </li>
  <li id="lipass">
   <label for="password">
    <span class="required"><img alt="lost-pass" src="<?php echo WWWROOT ?>_img/icons/key.png" />mot de passe
    <small class="help_form">(<a id="forgotPasswordLink" href="#">oublié</a> ?)</small></span>
   </label>
   <input name="password" type="password" class="text required ui-corner-all" id="password" minlength="4" maxlength="20" tabindex="2" accesskey="p" />
   <small  class="checker" ></small>
   <input type="hidden" name="errorpass" id="errorpass" value="0"/>
   <label for="password" class="error" id="error2"><img alt="exclamation" src="<?php echo WWWROOT ?>_img/icons/exclamation.png" />Ce champ est obligatoire.</label>
  </li>
  <li>
   <input name="rememberme" type="checkbox" id="rememberme" value="forever" tabindex="90" /><label for="rememberme"> Se souvenir de moi</label></p>
  </li>
  <li class="centeredtext">
    <input type="hidden" name="goto"  id="goto" value="<?php echo WWWROOT.$_SESSION['AFTER_LOGIN_GOTO'] ?>"/>
    <input type="hidden" name="login_type"  id="loginTypeNormal" value="normal"/>
    <input type="submit" class="ui-state-default button ui-corner-all short_input" value="GO!" id="submitlogin" tabindex="1" accesskey="L" />
   </li>
   <li id="lipassforget">
    <label class="centered info"><a class="dark_link openidLink" href="#" id="openidLink">avec OpenID</a></label>
   </li>
  </ul>
</form>

Answer 1

Have you by any chance changed the field names, i.e. was the password field called 'loginfield' at one point when the username/password were saved by Firefox? According to Mozilla's wiki the password manager stores the fieldname with the saved login details, so it could be related to that.

Have you tried to remove the username/password from Firefox's password manager and see if it happens again when you try to save the login details again?