<?php
include('includes/session.php');
include('includes/config.php');
date_default_timezone_set('Asia/Kolkata'); 
?>

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="Dashboard">
    <meta name="keyword" content="Dashboard, Bootstrap, Admin, Template, Theme, Responsive, Fluid, Retina">

    <title>AVIT | User Register Complaint</title>

    <!-- Bootstrap core CSS -->
    <link href="assets/css/bootstrap.css" rel="stylesheet">
    <link href="assets/css/style.css" rel="stylesheet">
    <link href="assets/css/nav.css" rel="stylesheet">
    <!--external css-->
    <link href="assets/font-awesome/css/font-awesome.css" rel="stylesheet" />
    <link rel="stylesheet" type="text/css" href="assets/js/bootstrap-datepicker/css/datepicker.css" />
    <link rel="stylesheet" type="text/css" href="assets/js/bootstrap-daterangepicker/daterangepicker.css" />
    <link href="assets/css/style.css" rel="stylesheet">
    <link href="assets/css/style-responsive.css" rel="stylesheet">
    <style>
		label{
			font-weight: bold;
		}
		input{
			text-transform: uppercase;
		}
	  </style>
	  <script>
//		  $('#ephone').blur(function() {
//if ($('#phone').attr('value') == $('#ephone').attr('value')) {
//alert('Same Value');
//return false;
//} else { return true; }
//});
function do_check()
{
  var str1 = $("#phone").val();
  var str2 = $("#ephone").val();

  if (str1 == str2)
  {
	  alert("Phone No. and Emergency No. Should not be same !");
	  document.getElementById('ephone').style.borderColor = "red";
	  $('#submit').prop('disabled',true);
  }
  else
  {
	  document.getElementById('ephone').style.borderColor = "#ccc";
	  $('#submit').prop('disabled',false);
	  return false;
  }
}
	  </script>
  </head>

  <body>

  <section id="container" >
     <?php include("includes/header.php");?>
      <?php include("includes/sidebar.php");?>
      <section id="main-content">
          <section class="wrapper">
          	<h3 align="center"> Staff Identity Card</h3>
          	
          	<!-- BASIC FORM ELEMENTS -->
          	<div class="row mt">
          		<div class="col-lg-12">
                  	<div class="col-sm-12 form-panel">
					  <h5 align="center" style="text-align:justify; font-family:'Trebuchet MS', Arial, Helvetica, sans-serif; color:#ff6347;"><strong>
Note: An asterisk (✱) indicates a required field. On submission, mandatory fields which are empty / Fields with Invalid values are highlighted in red</strong><br/><br/></h5>

<form action="staffiddownload.php" method="post" enctype="multipart/form-data" >
<div class="row">
<div class="col-sm-12">
<div class="form-group col-sm-4">
	<label>Name <span style="color: dodgerblue;">(Max 30 Characters)</span><span style="color:#F00;"> ✱</span></label>
<input type="text" name="name" required="" class="form-control" title="Maximum 30 Characters are Allowed" maxlength="30">
</div>
<div class="form-group col-sm-4">
	<label>Designation <span style="color: dodgerblue;">(Max 20 Characters)</span><span style="color:#F00;"> ✱</span></label>
<input type="text" name="designation" required="" class="form-control" title="Maximum 20 Characters are Allowed" maxlength="20">
</div>

<div class="form-group col-sm-4">
<label>Department<span style="color:#F00;"> ✱</span></label>
<select class="form-control" name="department" required>
<option value="">Select Department</option>
<option value="AUTOMOBILE">AUTOMOBILE</option>
<option value="ECE">ECE</option>
<option value="CIVIL">CIVIL</option>
<option value="BIO-MEDICAL">BIO-MEDICAL</option>
<option value="BIOTECHNOLOGY">BIOTECHNOLOGY</option>
<option value="CSE">CSE</option>
<option value="EEE">EEE</option>
<option value="MECHANICAL">MECHANICAL</option>
<option value="MECHATRONICS">MECHATRONICS</option>
<option value="TAMIL">TAMIL</option>
<option value="ENGLISH">ENGLISH</option>
<option value="PHYSICS">PHYSICS</option>
<option value="MATHEMATICS">MATHEMATICS</option>
<option value="CHEMISTRY">CHEMISTRY</option>
<!--<option value="B.Sc COMPUTER SCIENCE">B.Sc COMPUTER SCIENCE</option>-->
<option value="COMPUTER SCIENCE & APPLICATIONS">COMPUTER SCIENCE & APPLICATIONS</option>
<option value="DIRECTOR">DIRECTOR</option>
<option value="BBA">BBA</option>
<option value="MBA">MBA</option>
<option value="MCA">MCA</option>
<option value="HINDI">HINDI</option>
<option value="COMMERCE">COMMERCE</option>
<option value="AV CAMPUS">AV CAMPUS</option>
<option value="ARCHITECTURE">ARCHITECTURE</option>
<option value="ADMIN">ADMIN</option>
<option value="ACCOUNTS">ACCOUNTS</option>
<option value="ADMISSION CELL">ADMISSION CELL</option>
<option value="SAS">SAS</option>
<option value="LAW">LAW</option>
<option value="DoM">DoM</option>
<option value="SAP">SAP</option>
<option value="BIOCHEMISTRY">BIOCHEMISTRY</option>
<option value="PHARMACOLOGY">PHARMACOLOGY</option>
<option value="PHYSIOLOGY">PHYSIOLOGY</option>
<option value="MICROBIOLOGY">MICROBIOLOGY</option>
<option value="INNOVATION AND INCUBATION CENTER">INNOVATION AND INCUBATION CENTER</option>
<option value="ANATOMY">ANATOMY</option>
	</select>
</div>

<div class="form-group col-sm-6">
<label style="width: 100%;">Date of Birth<span style="color:#F00;"> ✱</span></label>
<div class="col-sm-4">
<select class="form-control" name="date" required>
	<option >Date</option>
	<option value="01">01</option>
	<option value="02">02</option>
	<option value="03">03</option>
	<option value="04">04</option>
	<option value="05">05</option>
	<option value="06">06</option>
	<option value="07">07</option>
	<option value="08">08</option>
	<option value="09">09</option>
	<option value="10">10</option>
	<option value="11">11</option>
	<option value="12">12</option>
	<option value="13">13</option>
	<option value="14">14</option>
	<option value="15">15</option>
	<option value="16">16</option>
	<option value="17">17</option>
	<option value="18">18</option>
	<option value="19">19</option>
	<option value="20">20</option>
	<option value="21">21</option>
	<option value="22">22</option>
	<option value="23">23</option>
	<option value="24">24</option>
	<option value="25">25</option>
	<option value="26">26</option>
	<option value="27">27</option>
	<option value="28">28</option>
	<option value="29">29</option>
	<option value="30">30</option>
	<option value="31">31</option>
	</select>
	</div>
	<div class="col-sm-4">
	<select class="form-control" name="month" required>
	<option value="">Month</option>
	<option value="JAN">JANUARY</option>
	<option value="FEb">FEBRUARY</option>
	<option value="MAR">MARCH</option>
	<option value="APR">APRIL</option>
	<option value="MAY">MAY</option>
	<option value="JUN">JUNE</option>
	<option value="JUL">JULY</option>
	<option value="AUG">AUGUST</option>
	<option value="SEP">SEPTEMBER</option>
	<option value="OCT">OCTOBER</option>
	<option value="NOV">NOVEMBER</option>
	<option value="DEC">DECEMBER</option>
	</select>
	</div>
	<div class="col-sm-4">
	<select class="form-control" name="year" required>
<option value="">Year</option>
<option value="1950">1950</option>
<option value="1951">1951</option>
<option value="1952">1952</option>
<option value="1953">1953</option>
<option value="1954">1954</option>
<option value="1955">1955</option>
<option value="1956">1956</option>
<option value="1957">1957</option>
<option value="1958">1958</option>
<option value="1959">1959</option>
<option value="1960">1960</option>
<option value="1961">1961</option>
<option value="1962">1962</option>
<option value="1963">1963</option>
<option value="1964">1964</option>
<option value="1965">1965</option>
<option value="1966">1966</option>
<option value="1967">1967</option>
<option value="1968">1968</option>
<option value="1969">1969</option>
<option value="1970">1970</option>
<option value="1971">1971</option>
<option value="1972">1972</option>
<option value="1973">1973</option>
<option value="1974">1974</option>
<option value="1975">1975</option>
<option value="1976">1976</option>
<option value="1977">1977</option>
<option value="1978">1978</option>
<option value="1979">1979</option>
<option value="1980">1980</option>
<option value="1981">1981</option>
<option value="1982">1982</option>
<option value="1983">1983</option>
<option value="1984">1984</option>
<option value="1985">1985</option>
<option value="1986">1986</option>
<option value="1987">1987</option>
<option value="1988">1988</option>
<option value="1989">1989</option>
<option value="1990">1990</option>
<option value="1991">1991</option>
<option value="1992">1992</option>
<option value="1993">1993</option>
<option value="1994">1994</option>
<option value="1995">1995</option>
<option value="1996">1996</option>
<option value="1997">1997</option>
<option value="1998">1998</option>
<option value="1999">1999</option>
<option value="2000">2000</option>
<option value="2001">2001</option>
<option value="2002">2002</option>
<option value="2003">2003</option>
<option value="2004">2004</option>
<option value="2005">2005</option>
<option value="2006">2006</option>
<option value="2007">2007</option>
<option value="2008">2008</option>
<option value="2009">2009</option>
<option value="2010">2010</option>
	</select>
	</div>
	
</div>
<div class="form-group col-sm-6">
<label>Blood Group<span style="color:#F00;"> ✱</span></label>
<select class="form-control" name="blood" required>
	<option value="">Blood</option>
<option value="A+">A+</option>
<option value="A1+">A1+</option>
<option value="A1B+">A1B+</option>
<option value="A-">A-</option>
<option value="B+">B+</option>
<option value="B-">B-</option>
<option value="O+">O+</option>
<option value="O-">O-</option>
<option value="AB+">AB+</option>
<option value="AB-">AB-</option>

	</select>
</div>
	</div>

<div class="form-group col-sm-12">
<div class="col-sm-12">
<label style="width: 100%;">Communication Address<span style="color:#F00;"> ✱</span></label>
	</div>
<div class="form-group col-sm-6">
	<label>Address Line 1 <span style="color: dodgerblue;">(Max 26 Characters)</span><span style="color:#F00;"> ✱</span></label>
<input type="text" name="address1"   required="" title="Maximum 26 Characters are Allowed" maxlength="26" class="form-control">
</div>

<div class="form-group col-sm-6">
	<label>Address Line 2 <span style="color: dodgerblue;">(Max 26 Characters)</span><span style="color:#F00;"> ✱</span></label>
<input type="text" name="address2"   required="" title="Maximum 26 Characters are Allowed" maxlength="26" class="form-control">
</div>

<div class="form-group col-sm-6">
	<label>Address Line 3 <span style="color: dodgerblue;">(Max 26 Characters)</span><span style="color:#F00;"> ✱</span></label>
<input type="text" name="address3"   required="" title="Maximum 26 Characters are Allowed" maxlength="26" class="form-control">
</div>

<div class="form-group col-sm-6">
	<label>Address Line 4 <span style="color: dodgerblue;">(Max 26 Characters)</span><span style="color:#F00;"> ✱</span></label>
<input type="text" name="address4"   required="" title="Maximum 26 Characters are Allowed" maxlength="26" class="form-control">
</div>

<div class="form-group col-sm-4">
<label>Phone No<span style="color:#F00;"> ✱</span></label>
<input type="text" name="phone" id="phone" maxlength="10"   required="" class="form-control">
</div>

<div class="form-group col-sm-4">
<label>Emergency Contact No<span style="color:#F00;"> ✱</span></label>
<input type="text" name="ephone" id="ephone" onblur="do_check()" maxlength="10" required="" class="form-control">
</div>

<div class="form-group col-sm-4">
<label>Personal Email-Id<span style="color:#F00;"> ✱</span></label>
<input type="email" name="email" title="Maximum 26 Characters are Allowed" class="form-control">
</div>
	</div>

                          <div class="form-group col-sm-12">
                           <div class="col-sm-10">
                           <center>
<button type="submit" name="submit" id="submit" class="btn btn-success">Submit</button>
							   <button type="reset" name="submit" class="btn btn-warning" style="margin-left: 10px;">Reset</button></center>
</div>
</div>
	</div>
						  </div>
                          

                          </form>
                          </div>
                          </div>  	
		</section>
      </section>
    <?php include("includes/footer.php");?>
  </section>

    <!-- js placed at the end of the document so the pages load faster -->
    <script src="assets/js/jquery.js"></script>
    <script src="assets/js/bootstrap.min.js"></script>
    <script class="include" type="text/javascript" src="assets/js/jquery.dcjqaccordion.2.7.js"></script>
    <script src="assets/js/jquery.scrollTo.min.js"></script>
    <script src="assets/js/jquery.nicescroll.js" type="text/javascript"></script>


    <!--common script for all pages-->
    <script src="assets/js/common-scripts.js"></script>

    <!--script for this page-->
    <script src="assets/js/jquery-ui-1.9.2.custom.min.js"></script>

	<!--custom switch-->
	<script src="assets/js/bootstrap-switch.js"></script>
	
	<!--custom tagsinput-->
	<script src="assets/js/jquery.tagsinput.js"></script>
	
	<!--custom checkbox & radio-->
	
	<script type="text/javascript" src="assets/js/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
	<script type="text/javascript" src="assets/js/bootstrap-daterangepicker/date.js"></script>
	<script type="text/javascript" src="assets/js/bootstrap-daterangepicker/daterangepicker.js"></script>
	
	<script type="text/javascript" src="assets/js/bootstrap-inputmask/bootstrap-inputmask.min.js"></script>
	
	
	<script src="assets/js/form-component.js"></script>    
    
    
  <script>
      //custom select box

      $(function(){
          $('select.styled').customSelect();
      });

  </script>

  </body>
</html>

