<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="container"> <div id="login" class="modal-dialog"> <div class="modal-content"> <div class="modal-body"> <div class="alert alert-info"><span class="glyphicon glyphicon-log-in"></span> <strong>Login</strong></div><hr> <form id="formLogin" class="form" action='login.php' method='POST' role="form"> <label>Username</label> <div style="margin-bottom: 12px" class="input-group"> <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span> <input id="username" type="text" class="form-control" name="UserID" value="" placeholder="Username" data-toggle="tooltip" data-placement="top" title="Inserire l'username" required=""> </div> <label>Password</label> <div style="margin-bottom: 12px" class="input-group"> <span class="input-group-addon"><i class="glyphicon glyphicon-lock"></i></span> <input id="password" type="password" class="form-control" name="Password" placeholder="Password" data-toggle="tooltip" data-placement="top" title="Inserire la password" required=""> </div> <div align="center"><button type="submit" class="btn btn-primary"><span class="glyphicon glyphicon-log-in"></span> Login</button></div><hr> <div align="center"> <a href="#" class="btn btn-warning" onClick="$('#login').hide(); $('#register').show()">Non sei registrato? Compila modulo registrazione</a> </div> </form> </div> </div> </div> <div id="register" class="modal-dialog" style="display:none"> <div class="modal-content"> <div class="modal-body"> <div class="alert alert-info"><span class="glyphicon glyphicon-user"></span> <strong>Modulo Registrazione</strong> </div><hr> <form id="formSignUp" class="form-horizontal" action='signup.php' method='POST' role="form"> <div class="form-group"> <label class="control-label col-sm-4" for="UserName">UserName</label> <div class="col-sm-8"> <input type="text" id="UserName" class="form-control" placeholder="Inserire l'username" name="UserName" maxlength="32" value="" data-toggle="tooltip" data-placement="top" title="Inserire l'username" required=""> </div> </div> <div class="form-group"> <label class="control-label col-sm-4" for="Password">Password</label> <div class="col-sm-8"> <input type="password" id="Password" class="form-control" placeholder="Reinserire la password" name="Password" maxlength="32" value="" data-toggle="tooltip" data-placement="top" title="Inserire la password" required=""> </div> </div> <div class="form-group"> <label class="control-label col-sm-4" for="Password2">Conferma Password</label> <div class="col-sm-8"> <input type="password" id="Password2" class="form-control" placeholder="Inserire la password" name="Password2" maxlength="32" value="" data-toggle="tooltip" data-placement="top" title="ReiInserire la password" required=""> </div> </div> <div class="form-group"> <label class="control-label col-sm-4" for="Cognome">Cognome</label> <div class="col-sm-8"> <input type="text" id="Cognome" class="form-control" placeholder="Cognome" name="Cognome" maxlength="50" value="" data-toggle="tooltip" data-placement="top" title="Inserire il cognome" required=""> </div> </div> <div class="form-group"> <label class="control-label col-sm-4" for="Nome">Nome</label> <div class="col-sm-8"> <input type="text" id="Nome" class="form-control" placeholder="Nome" name="Nome" maxlength="50" value="" data-toggle="tooltip" data-placement="top" title="Inserire il nome" required=""> </div> </div> <div class="form-group"> <label class="control-label col-sm-4" for="Email">Email</label> <div class="col-sm-8"> <input type="text" id="Email" class="form-control" placeholder="Email" name="Email" maxlength="100" value="" data-toggle="tooltip" data-placement="top" title="Inserire l'email" required=""> </div> </div> <div align="center"><button type="submit" class="btn btn-primary"><span class="glyphicon glyphicon-user"></span> Registrati</button></div><hr> <div align="center"> <a href="#" class="btn btn-warning" onClick="$('#register').hide(); $('#login').show()">Sei registrato? Esegui il login</a> </div> </form> </div> </div> </div> </div>