Unwanted Autofills

Question

I am having a problem in my web application. I seem to have been experiencing auto-fill in my username and password field. It is ok when I do a log in, the problem is it still does the auto-fill even in the create account page, even though I named my textFields(InputText) different from the other. I have tried this in both chrome and firefox, it still the same.

Here are some screenshots of the application and codes.

For the create account page

     <p:outputLabel id="userLabel" value="Username*" />
     <p:inputText id="userField" 
        value="#{marketingPersonController.marketingPerson.account.username}" 
        required="true" requiredMessage="Username* value is required." 
        label="UsernameInput">

        <f:ajax 
            listener="#{marketingPersonController.checkUsernameIfAvailable()}"/>
     </p:inputText>

     <p:outputLabel id="passLabel" value="Password*"/>
     <p:password id="passField" 
        value="#{marketingPersonController.marketingPerson.account.password}"
        feedback="true" inline="true" 
        match="confirmPassField" required="true" 
        requiredMessage="Password* value is required" label="PasswordInput"  
        validatorMessage="Password must be at least 6 characters / Password does not match">
        <f:validateLength minimum="6" />
     </p:password>

For my log in

Here is my code for log in:

<table>
   <tr>
      <td><p:outputLabel rendered ="#{!accountController.loggedIn}" value ="Username:"/></td>
      <td><p:inputText rendered="#{!accountController.loggedIn}" id="username" value="#{accountController.account.username}"/></td>
      <td><p:message for="username" rendered ="false"/></td>
   </tr>
   <tr>
      <td><p:outputLabel rendered="#{!accountController.loggedIn}" value="Password:"/></td>
      <td><p:password rendered="#{!accountController.loggedIn}" id="password" value="#{accountController.account.password}"/></td>
      <td><p:message for="password" rendered ="false"/></td>
   </tr>

Answer 1

You need to turn off the autocomplete,but jsf does not have an autocomplete attribute. So that means you have to turn it off on a per-input basis or write a custom renderer for the UIForm.

There's currently an open issue which requests to add this attribute to the : JSF spec issue 418. Currently, it's scheduled for JSF 2.2.

In the meanwhile, you can use OmniFaces Html5RenderKit to get support for autocomplete="off" on the component.

Answer 2

Here (MDN) you can find some recomended workarounds if the solution with autocomplete="off" won't work.