arya-oss/login-signup-tabpane-popup.php

## login-signup-tabpane-popup.php
<!DOCTYPE html>
<html>
<head>
	<title>Modal Test</title>
	<meta name="viewport" content="width=device-width, initial-scale=1">
  	<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
  	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
  	<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<div class="row">
	<div class="col-xs-12 col-sm-6 col-md-4">
		<button class="btn btn-info" type="button" data-toggle="modal" data-target="#loginmodal">Login </button>
		<div id="loginmodal" class="modal fade" role="dialog">
		<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-body">
				<ul class="nav nav-tabs">
					<li class="active"><a href="#login" data-toggle="tab">Login</a></li>
					<li><a href="#signup" data-toggle="tab">Sign Up</a></li>
				</ul>
				<div class="tab-content">
					<div class="tab-pane fade active in" id="login">
		<form class="form-horizontal" id="loginform" action="<?php $_SERVER['PHP_SELF'] ?>" method="post">
			<div class="form-group">
			<div class="col-sm-12">
				<label for="uname" class="control-label">Username</label>
				<input type="text" name="uname" id="uname" class="form-control" placeholder="Username">
			</div>
			</div>
			<div class="form-group">
			<div class="col-sm-12">
				<label for="pass" class="control-label">Password</label>
				<input type="password" name="pass" id="pass" class="form-control" placeholder="Password">
			</div>
			</div>
			<div class="form-group">
			<div class="col-sm-12">
				<button class="btn btn-success" type="submit"> Login </button>
			</div>
			</div>
		</form>
					</div>
					<div class="tab-pane fade" id="signup">
		<form class="form-horizontal" id="signupform" action="<?php echo htmlspecialchars($_SERVER['PHP_SELF']); ?>" method='post'>
			<div class="form-group">
				<div class="col-sm-6">
					<label for="fname" class="control-label">First Name</label>
					<input class="form-control input-sm" name="fname" id="fname" placeholder="First Name">
				</div>
				<div class="col-sm-6">
					<label for="lname" class="control-label">Last Name</label>
					<input class="form-control input-sm" name="lname" id="lname" placeholder="Last Name">
				</div>
			</div>
			<div class="form-group">
			<div class="col-sm-12">
				<label for="uname" class="control-label">Username</label>
				<input type="text" name="uname" id="uname" class="form-control input-sm" placeholder="Username">
			</div>
			</div>
			<div class="form-group">
			<div class="col-sm-6">
				<label class="control-label" for="dob">Date of Birth </label>
				<input name="dob" id="dob" class="form-control input-sm" editable='false'/>
			</div>
			<div class="col-sm-6">
				<label for="gender" class="control-label">Sex</label>
				<div class="radio">
					<label><input type="radio" name="gender" id="gender" value="male" checked="checked" /> Male </label>
					<label><input type="radio" name="gender" id="gender" value="female"/> Female</label>
				</div>
			</div>
			</div>

			<div class="form-group">
			<div class="col-sm-12">
				<label for="email" class="control-label">Email ID</label>
				<input type="email" name="email" id="email" class="form-control input-sm" placeholder="Email">
			</div>
			</div>
			<div class="form-group">
			<div class="col-sm-12">
				<label for="phone" class="control-label">Phone</label>
				<input type="tel" name="phone" id="phone" class="form-control input-sm" placeholder="Phone Number">
			</div>
			</div>
			<div class="form-group">
			<div class="col-sm-12">
				<label for="pass" class="control-label">Password</label>
				<input type="password" name="pass" id="pass" class="form-control input-sm" placeholder="Password">
			</div>
			</div>
			<div class="form-group">
			<div class="col-sm-12">
				<label for="passconf" class="control-label">Password Confirm</label>
				<input type="password" name="passconf" id="passconf" class="form-control input-sm" placeholder="Password Confirm">
			</div>
			</div>
			<div class="form-group">
			<div class="col-sm-12">
				<div class="checkbox">
					<label for="agree"><input type="checkbox" name="agree" id="agree"> Do you agree with our <a href="#">Terms and Condition</a> and <a href="#">Privacy Policy.</a></label>
				</div>
			</div>
			</div>
			<div class="form-group">
			<div class="col-sm-12">
				<button class="btn btn-success btn-sm" type="submit">Submit</button>
			</div>
			</div>
		</form>
					</div>
				</div>
			</div>
			<div class="modal-footer">
				<button class="btn btn-warning" data-dismiss="modal" type="button"> Close </button>
			</div>
		</div>
		</div>
		</div>
	</div>
</div>
</div>
</body>
</html>