signup step mobile otp sms verify php ajax

1<!-- Login & Signup -->
2<div id="login" class="modal fade loginsignup" role="dialog">
3    <div class="modal-dialog md-modal">
4	<!-- Login box-->
5	<div class="modal-content" id="loginBox">
6		<div class="modal-header">
7		<button type="button" class="close" data-dismiss="modal">×</button>
8		<h4 class="modal-title"><img src="images/logo.png" alt="logo" width="150px"></h4>
9		</div>
10		<div class="register-form">
11			<form action="" method="POST" id="loginform">
12				<div class="form-group">
13				<input type="text" class="form-control" placeholder="Enter Your Mobile..." id="login-mobile" name="mobile">
14				</div>
15				<div class="form-group">
16				<input type="password" class="form-control" placeholder="Password" id="login-password" name="password">
17				</div>
18				<a href="#" class="forget-password">FORGOT PASSWORD</a>
19				<button type="submit" class="btn btn-default" name="login">LOGIN HERE</button>
20						
21				<p class="login-alert" style="display:none;color:red;">Either password or mobile number is wrong!</p>
22				<p class="login-alert1" style="display:none;color:red;">Account not activated!</p>
23						
24			</form>
25			</div>
26			<div class="modal-footer">
27				<p>Not a member? <span class="signup-btn">Register</span></p>
28			</div>
29		</div>
30			
31			
32			
33			<!--signup box-->
34			<div class="modal-content" id="signupBox">
35				<div class="modal-header">
36					<button type="button" class="close" data-dismiss="modal">×</button>
37					<h4 class="modal-title"><img src="images/logo.png" alt="logo" width="150px"></h4>
38				</div>
39		
40				<div class="register-form">
41					<form action="" method="POST" id="getotp">
42						<div class="form-group">
43							<input type="text" class="form-control" required placeholder="Enter Your Mobile..." id="mobile-otp">
44						</div>
45						<p class="otp-error" style="display:none;color:red;">Please enter a valid number!</p>
46						<p class="otp-error1" style="display:none;color:red;">Under maintainance!</p>
47						<button type="submit" class="btn" id="get-otp" name="register">Get OTP</button>
48					</form>
49				</div>
50				<div class="modal-footer">
51					<p><p>Already registered? <span class="signin-btn">LOGIN</span></p></p>
52				</div>
53			</div>
54			
55			
56			<!--verify password-->
57			<div class="modal-content" id="verifybox">
58			<div class="modal-header">
59				<button type="button" class="close" data-dismiss="modal">×</button>
60				<h4 class="modal-title"><img src="images/logo.png" alt="logo" width="150px"></h4>
61				</div>
62		
63				<div class="register-form">
64				<h3 class="text-center">ENTER OTP</h3>
65					<h4 style="color:#fff; margin-bottom:10px; text-align:center; font-size:10px; " >OTP sent to <b>+91-</b><b class="verify-no"></b> <span class="signup-btn"><i class="fa fa-pencil"></i> edit</span></h4>
66			<form action="" method="POST" id="getverify">
67			<div class="form-group otp-list">
68			<input type="hidden" class="form-control" value="" id="hid-mobile">	
69			<input type="text" class="form-control" required id="verifyotp1" maxlength="1">
70			<input type="text" class="form-control" required id="verifyotp2" maxlength="1">
71			<input type="text" class="form-control" required id="verifyotp3" maxlength="1">
72		<input type="text" class="form-control" required id="verifyotp4" maxlength="1">
73			<input type="text" class="form-control" required id="verifyotp5" maxlength="1">
74			<input type="text" class="form-control" required id="verifyotp6" maxlength="1">
75			</div>
76			<div class="clearfix"></div>
77			<p class="verify-error" style="display:none;color:red;">OTP length must be in 6 digit!</p>
78				<p class="verify-error1" style="display:none;color:red;">Wrong OTP!</p>
79			<p class="expire-otp" style="display:none;color:red;"></p>
80				<button type="submit" class="btn" id="verify-otp" name="register">Enter</button>
81						
82				</form>
83				</div>
84			</div>			
85		</div>
86	</div>
87