0

We have a basic registration jsp with fields for First name, Last name, Email-id, Password and Confirm password. To disable suggestions in controls we tried autocomplete="off" in form and in individual controls, suggestions were disabled for First name and Last name, but for Email-id suggestions are still coming. This is the code

<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<c:set var="contextPath" value="${pageContext.request.contextPath}"/>

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Create an account</title>

        <link href="${contextPath}/resources/css/bootstrap.min.css" rel="stylesheet">
        <link href="${contextPath}/resources/css/common.css" rel="stylesheet">
    </head>

    <body>

        <div class="container">

            <form:form id="regForm" method="POST" autocomplete="off" class="form-signin">
                <div class="jumbotron text-center">
                    <h1>Register your account here with your Email id</h1>
                </div>
                <div class="col-sm-6">
                    <spring:bind path="firstName">
                        <div class="form-group ${status.error ? 'has-error' : ''}">
                            <form:input type="text" path="firstName" class="form-control" autocomplete="off" placeholder="First name"></form:input> <!-- Suggestions disabled -->
                            <form:errors path="firstName"></form:errors>
                        </div>
                    </spring:bind>

                    <spring:bind path="lastName">
                        <div class="form-group ${status.error ? 'has-error' : ''}">
                            <form:input type="text" path="lastName" class="form-control" autocomplete="off" placeholder="Last name"></form:input> <!-- Suggestions disabled -->
                            <form:errors path="lastName"></form:errors>
                        </div>
                    </spring:bind>

                    <spring:bind path="username">
                        <div class="form-group ${status.error ? 'has-error' : ''}">
                            <form:input type="email" path="username" class="form-control" autocomplete="off" placeholder="Email id"></form:input> <!-- Suggestions not disabled -->
                            <form:errors path="username"></form:errors>
                        </div>
                    </spring:bind>

                    <spring:bind path="password">
                        <div class="form-group ${status.error ? 'has-error' : ''}">
                            <form:input type="password" path="password" class="form-control" autocomplete="off" placeholder="Password"></form:input>
                            <form:errors path="password"></form:errors>
                        </div>
                    </spring:bind>

                    <spring:bind path="passwordConfirm">
                        <div class="form-group ${status.error ? 'has-error' : ''}">
                            <form:input type="password" path="passwordConfirm" class="form-control" autocomplete="off" placeholder="Confirm your password"></form:input>
                            <form:errors path="passwordConfirm"></form:errors>
                        </div>
                    </spring:bind>
                </div>

                <div class="col-lg-6">
                    <button class="btn btn-lg btn-success" type="submit">Register</button>
                    <a href="${contextPath}/loginEmployee">Back to login</a>
                </div>

            </form:form>

        </div>

        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
        <script src="${contextPath}/resources/js/bootstrap.min.js"></script>
    </body>
</html>

Screen Shot

We tried the above code in plain HTML but the effect was same

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Create an account</title>
    </head>

    <body>
        <div class="container">
            <form method="POST" autocomplete="off" class="form-signin">
                <div class="jumbotron text-center">
                    <h1>Register your account here with your Email id</h1>
                </div>
                <div class="col-sm-6">
                    <div class="form-group">
                        <input type="text" name="firstName" class="form-control" autocomplete="off" placeholder="First name"/> <!-- Suggestions disabled -->
                    </div>

                    <div class="form-group">
                        <input type="text" name="lastName" class="form-control" autocomplete="off" placeholder="Last name"/> <!-- Suggestions disabled -->
                    </div>

                    <div class="form-group">
                        <input type="email" name="username" class="form-control" autocomplete="off" placeholder="Email id"/> <!-- Suggestions not disabled -->
                    </div>

                    <div class="form-group">
                        <input type="password" name="password" class="form-control" autocomplete="off" placeholder="Password"/>
                    </div>

                    <div class="form-group">
                        <input type="password" name="passwordConfirm" class="form-control" autocomplete="off" placeholder="Confirm your password"/>
                    </div>
                </div>

                <div class="col-lg-6">
                    <button class="btn btn-lg btn-success" type="submit">Register</button>
                    <a href="${contextPath}/loginEmployee">Back to login</a>
                </div>

            </form>

        </div>

        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
         <!-- Latest compiled and minified CSS -->
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">

        <!-- jQuery library -->
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

        <!-- Latest compiled JavaScript -->
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script> 
    </body>
</html>

We tried How do we control web page caching, across all browsers? but still it is not working, then we assumed like it might be the username so we changed the field to

<input type="text" name="something" class="form-control" autocomplete="off" placeholder="Something">

Still suggestions are coming for the field.

If suggestions are disabled for first two fields why it is not done for Email-id?

PS : Browsers used Mozilla Firefox 68.0.1 and Chrome 75.0.3770.142

Arun Sudhakaran
  • 1,833
  • 2
  • 16
  • 41

0 Answers0