Responsive Login

If you have questions or if you want to share your opinion about Aware IM post your message on this forum
Post Reply
lineamovil
Posts: 201
Joined: Tue Jul 27, 2010 2:17 am
Location: Mexico

Responsive Login

Post by lineamovil »

Hello!

Im trying to implement this custom responsible login. It works fine. But when I make a mistake in the access password, it would redirect me to a page with code string. It wont stay and show me the error.

The file I created is named: logon.html and it is placed here: C:\AwareIM\Tomcat\webapps\AwareIM
Any suggestion in how to handle this? Best regards,

This is the code inside it:

Code: Select all

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title> -Autolineas Potosinas Acceso a Usuarios-</title>
    <link rel="stylesheet" href="login.css">
    
    <link href='http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,400,300,600,700' rel='stylesheet' type='text/css'>
    
</head>
<body>
    <h1><img src="images/logo.png" class="img-reponsive" alt="My App"></h1>
    <div class="login">
        <div class="ribbon-wrapper h2 ribbon-red">
            <div class="ribbon-front">
                <h2>Acceso</h2>
			</div>
            <div class="ribbon-edge-topleft2"></div>
            <div class="ribbon-edge-bottomleft"></div>
        </div>
        <form action="../AwareIM/logonOp.aw" method="post" name="submitForm" id="submitForm">
            <ul>
                <li>
                   <input id="username" tabindex="1" type="text" name="userName" class="text" placeholder="Usuario" required><i class="icon user"></i>
				            
                </li>
                 <li>
     <input id="password" type="password" name="password" tabindex="2" style="width: 72%;" placeholder="Password" class="form-control" required><i class="icon lock"></i>
  <div style="display: block;float: right;padding-top: 16px;padding-left: 8px;padding-right: 8px;padding-bottom: 8px;text-align: center;" onclick="if(password.type=='text')password.type='password'; else password.type='text';">
  <img src="https://cdn0.iconfinder.com/data/icons/feather/96/eye-16.png" alt="eye">
  </div> 
  </li>
            </ul>
            <div class="submit">
                 <input type="submit" id="submit" tabindex="3" class="btn btn-primary btn-block" value="Acceder">
            </div>
		<input name="domain" type="hidden" value="MyApp">
        </form>
       
       <div id="errorMsg" style="display:none"></div>
    </div>
   
    <script>
       
    var errorDiv = document.getElementById("errorMsg");

    if (errorDiv) {

        var errorMsg = "";

        for (var i = 0; i < errorDiv.childNodes.length; ++i) {
            errorMsg += errorDiv.childNodes[i].nodeValue;
        }

        if (errorMsg.length > 0) {
            document.getElementById("username").style.borderColor = "#f00";

            document.getElementById("password").style.borderColor = "#f00";


            alert(errorMsg);

        }

    }


    </script>
</body>
</html>
LineaMovil // Carlos Castillo
AwareIM Version 8.6
Windows Server 2021
MySQL Database 8.4
MEXICO
Post Reply