Screenshot:
index.php:
<body> <div style="margin:60px; padding:20px"> <form method="post" action="" id="form"> <div class="whole"> <div style="margin-bottom:6px"> <h3><?php if(isset($message)){echo $message;}?></h3> <h2 style="color:#006699; text-align:center;">Login or Signup</h2> <label>Email</label> <br/> <input type="text" name="email" class="input" id="email" autocomplete="off"/><br /> <input type="radio" name="choose" id="login" checked="checked" class="radio"/>Already Member Login <br /> <input type="radio" name="choose" id="signup" class="radio"/>Want to a Member Register<br /> <input type="radio" name="choose" id="guest" class="radio"/>Want To Be a Guest<br /> </div> <div style="" id="login_block"> <label>Password</label><br /> <input type="password" name="password" class="input" id="password"/><br/> <input type="submit" value=" Login " class="button" name="login"/> <input type="submit" value=" Forgot Password " class="button" id="forget" name="password"/> </div> <div id="signup_block"> <label>Choose password</label><br/> <input type="password" name="newpassword" class="input" id="newpassword" /><br/> <input type="submit" value=" Signup " class="button" name="signup"/> </div> <div id="guest_block"> <input type="submit" value="Guest" class="button" name="guest"/> </div> <div id="forget_block"> <input type="submit" value=" Reset Password " class="button" name="password"/> </div> </form> </div> </div> </body>
Script:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function() { $('#forget_block').hide(); $('#guest_block').hide(); $('#signup').click(function() { document.getElementById('password').value=''; $('#login_block').hide(); $('#signup_block').show(); $('#forget_block').hide(); $('#guest_block').hide(); }); $('#login').click(function() { document.getElementById('newpassword').value=''; $('#signup_block').hide(); $('#login_block').show(); $('#forget_block').hide(); $('#guest_block').hide(); }); $('#guest').click(function() { document.getElementById('newpassword').value=''; $('#signup_block').hide(); $('#login_block').hide(); $('#forget_block').hide(); $('#guest_block').show(); }); $('#forget').click(function() { document.getElementById('forget').value=''; $('#signup_block').hide(); $('#login_block').hide(); $('#forget_block').show(); $('#guest_block').hide(); }); $.validator.addMethod("email", function(value, element) { return this.optional(element) || /^[a-zA-Z0-9._-]+@[a-zA-Z0-9-]+\.[a-zA-Z.]{2,5}$/i.test(value); }, "Please enter a valid email address."); // Validate signup form $("#form").validate({ rules: { email: "required email", }, }); }); </script>
PHP Coding:
<?php $conn=mysql_connect("localhost","root",""); $db=mysql_select_db("shopdb", $conn); if(isset($_POST['login'])!="") { $email = $_POST['email']; $password = $_POST['password']; $login1 = mysql_query("select * from users where email='$email' and password='$password'"); $Results = mysql_fetch_array($login1); if($Results>1) { $message ="Login Sucessfully!!"; } else { $message = "Invalid Username and Password"; } } elseif(isset($_POST['signup'])!="") { $email = $_POST['email']; $password = $_POST['newpassword']; $query1 = mysql_query("SELECT email FROM users where email='$email'"); $numResults = mysql_num_rows($query1); if($numResults>=1) { $message ="Email already exist!!"; } else { $query = mysql_query("insert into users(email,password) values('$email','$password')") or die (mysql_error()); $message = "Signup Sucessfully!!"; } } elseif(isset($_POST['guest'])!="") { $email = $_POST['email']; $query1 = mysql_query("SELECT email FROM users where email='$email'"); $numResults1 = mysql_num_rows($query1); if($numResults1>=1) { $message =" Email already exist!!"; } else { $query = mysql_query("insert into users(email) values('$email')"); $message = "Guest Sucessfully!!"; } } elseif(isset($_POST['password'])!="") { $email= $_POST['email']; $query4 = mysql_query("select email FROM users where email='$email'"); $Results1 = mysql_fetch_array($query4); if($Results1>=1) { $encrypt = $Results1['email']; $message = "Your password reset link send to your e-mail address."; $to=$email; $subject="Forget Password"; $from = 'gomathi.m@purpledot.in'; $body='Hi, <br/> <br/>Your Password is '.$Results1['email'].' '; $headers = "From: " . strip_tags($from) . "\r\n"; $headers .= "Reply-To: ". strip_tags($from) . "\r\n"; $headers .= "MIME-Version: 1.0\r\n"; $headers .= "Content-Type: text/html; charset=ISO-8859-1\r\n"; mail($to,$subject,$body,$headers); //$query = "SELECT id FROM users where md5(90*13+id)='".$encrypt."'"; // $Results = mysqli_fetch_array($result); // print_r($Results); // $message = $encrypt. $query; } else { $message = "Account not found please signup now!!"; } } ?>
Style.css:
body { font-family:Arial, Helvetica, sans-serif; font-size:12px; } form{ border:1px solid #006699; width:60%; height:auto; margin:45px auto; box-shadow:inset 2px 2px 2px #006699;} label { color:#999; padding:4px; margin-top:4px; color:#006699; } .input { padding:9px; border:solid 1px #999; margin:4px; width:220px; } .radio { margin:4px; } .button { font-size:15px; padding:6px; font-weight:bold; } label.error { font-size:11px; background-color:#dedede; color:#000; padding:3px; margin-left:5px; -moz-border-radius: 4px; -webkit-border-radius: 4px; } #signup_block { display:none; } .whole { padding:25px; }
In this coding by using radio button we can open login and signup form using Simple Javascript.I hope this coding is very usefull for you.And we have create the database fields for Login,Signup and want to be guest for all fields we have to create the db fields.
No comments:
Post a Comment