0byt3m1n1
Path:
C:
/
wamp64
/
www
/
id
/
[
Home
]
File: form2.php
<!doctype html> <html lang="en"> <head> <!-- Required meta tags --> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <title>CWRDM ID CARD REGISTRATION PORTAL</title> <!-- web fonts --> <link href="//fonts.googleapis.com/css?family=Work+Sans:100,200,300,400,500,600,700,800,900&display=swap" rel="stylesheet"> <!-- //web fonts --> <!-- Template CSS --> <link rel="stylesheet" href="assets/css/style-starter.css"> <script src="validationscript.js"></script> <?php include("db_connect.php"); ?> </script> <script type="text/javascript"> function validateImage() { var formData = new FormData(); var file = document.getElementById("photo").files[0]; formData.append("Filedata", file); var t = file.type.split('/').pop().toLowerCase(); var fileUpload = document.getElementById("photo"); if (t != "jpeg" && t != "jpg" && t != "png" && t != "bmp" && t != "gif") { alert('Please select a valid image file'); document.getElementById("photo").value = ''; return false; } if (file.size > 100000) { alert('Max Upload size is 100KB only'); document.getElementById("photo").value = ''; return false; } if (typeof (photo.files) != "undefined") { //Initiate the FileReader object. var reader = new FileReader(); //Read the contents of Image File. reader.readAsDataURL(photo.files[0]); reader.onload = function (e) { //Initiate the JavaScript Image object. var image = new Image(); //Set the Base64 string return from FileReader as source. image.src = e.target.result; //Validate the File Height and Width. image.onload = function () { var height = this.height; var width = this.width; if (height > 250 || width > 200) { alert("Height and Width must not exceed desired size."); document.getElementById("photo").value = ''; return false; } alert("photo uploaded successfully"); return true; }; } } else { alert("This browser does not support HTML5."); return false; } return true; } </script> </head> <body> <!-- Top Menu 1 --> <section class="w3l-top-menu-1"> <div class="top-hd"> <div class="container"> <header class="row top-menu-top"> <div class="accounts col-md-9 col-6"> <!-- <a href="http://cwrdm.org/" class="standard-logo" data-dark-logo="http://cwrdm.org/nexshop/themes/cwrdm/assets/img/cwrdm_header.png"><img src="http://cwrdm.org/nexshop/themes/cwrdm/assets/img/cwrdm_header.png" alt="CWRDM Logo" height="100px;"></a> --> <a href="http://cwrdm.org/" class="retina-logo" data-dark-logo="http://cwrdm.org/nexshop/themes/cwrdm/assets/img/cwrdm_header.png"><img src="http://cwrdm.org/nexshop/themes/cwrdm/assets/img/cwrdm_header.png" alt="CWRDM Logo"></a> </div> <!-- <div class="social-top col-md-3 col-6"> <a href="contact.html" class="btn btn-secondary btn-theme4">Apply Now</a> </div> --> <!-- Additional CSS Files --> <link rel="stylesheet" type="text/css" href="assets/css/bootstrap.min.css"> <link rel="stylesheet" type="text/css" href="assets/css/font-awesome.css"> <link rel="stylesheet" href="assets/css/templatemo-breezed.css"> <link rel="stylesheet" href="assets/css/owl-carousel.css"> <link rel="stylesheet" href="assets/css/lightbox.css"> <style> .container input[type="submit"] { /* background: linear-gradient(#52A0FD, #00e2fa); background: linear-gradient(145deg, #339b9e 0%, #68cc98 100% );*/ color:black; font-size:16px; background: White; border-radius: 50px; box-shadow: 5px 5px 10px black; border:solid; border-color: darkcyan; outline: none; } .container input[type="submit"]:hover { color: #fff; /* background: #339b9e; background: linear-gradient(#fa6c9f, #ffe140);*/ background:darkcyan; font-size: 16px; transition: .5s; } .container input[type="file"] { /* background: linear-gradient(145deg, #339b9e 0%, #68cc98 100%); font-size: 16px; */ font-size:16px; background: White; border-radius: 50px; box-shadow: 5px 5px 10px black; border:solid; border-color: darkcyan; outline: none; } .container input[type="file"]:hover { color: #fff; /* background: #339b9e; */ background:darkcyan; font-size: 16px; transition: .5s; font-size: 16px; transition: .5s; } .extbtn { background: white; font-size: 16px; margin-top: 10%; margin-left: 35%; border: revert; border-radius: 50px; box-shadow: 5px 5px 10px black; width:100px; border-color:red; } .extbtn:hover { color: #fff; background: red; font-size: 16px; transition: .5s; } .patent { color:#fff; margin-left: 40%; margin-top: 20px; } .btn-container { width:100%; } .btn-container input { display:block; width:50%; } </style> </header> </div> </div> </section> <!-- //Top Menu 1 --> <section class="w3l-bootstrap-header"> <nav class="navbar navbar-expand-lg navbar-light py-lg-2 py-2"> <div class="container"> <!-- <a class="navbar-brand" href="index.php"><span class="fa fa-pencil-square-o "></span> CWRDM</a> if logo is image enable this <a class="navbar-brand" href="#index.html"> <img src="image-path" alt="Your logo" title="Your logo" style="height:35px;" /> </a> --> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon fa fa-bars"></span> </button> <div class="collapse navbar-collapse" id="navbarSupportedContent"> </div> </div> </nav> </section> <section class="section" id="contact-us"> <div class="container"> <div class="row"> <div class="col-lg-4 col-md-4 col-xs-12" > <div class="left-text-content" style="margin-left:-20%; "> <div class="section-heading"> <h6><strong>INSTRUCTIONS </strong> </h6> </div> <ul class="contact-info"> <li>All Fileds are mandatory</li> <li>Please do aware about your Principal Investigator, Project Code and its duration.</li> <li>Get ready with scanned copy of a recent passport size photograph in JPG/JPEG/PNG/BMP/GIF format. <p style="font-size:12px;line-height: 15px"><i style="color: darkblue"> (Size of the Photograph should be < 100kb with 200px Width & 250px height.) </i></p> <!-- <li><a href="https://picresize.com" target="_blank"> Do you want to resize your photograph?</a></li>--> <li>Edit option is available only at preview page. Once submitted, the details can't be changed/modified. </li> <li>Submit the copy of the application by an Email to the Registrar through respective Group Head.</li> </ul> <div class="row"> <button type="button" name="logout" id="logout" onclick="window.location.href ='index.php'" class="extbtn" > Exit </button> </div> </div> </div> <div class="col-lg-1 col-md-4 col-xs-12" > </div> <div class="col-lg-7 col-md-8 col-xs-12" > <h2> Register here for your ID CARD</h2><hr/><br> <div class="contact-form"> <form action="preview.php" method="post" onsubmit="return validation()" enctype='multipart/form-data' class="form-group"> <div class="row"> <div class="col-lg-6"> <label >First Name </label> <input type="text" name="first_name" id="first_name" class="form-control" required="" placeholder="In capital letters"/> </div> <div class="col-lg-6"> <label >Last Name</label> <input type="text" name="last_name" id="last_name" class="form-control" required="" placeholder="Last name or Initial"/> </div> </div> <div class="row"> <div class="col-lg-6"> <label >Date of birth</label> <input type="date" name="dob" id="dob" class="form-control" required=""/> </div> <div class="col-lg-6"> <label > Blood Group </label> <select name="blood_group" class="form-control" required=""> <option value="">--Select your blood group--</option> <option value="AB+">AB+ </option> <option value="AB-">AB- </option> <option value="A+"> A+</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> </select> </div> </div> <br> <div class="row"> <div class="col-lg-6"> <label >Designation </label> <select name="designation" class="form-control" required=""> <option value="">--Select your designation--</option> <?php $sqli="SELECT * FROM designation"; $result=mysqli_query($db,$sqli); while($row = mysqli_fetch_array($result)) { echo '<option>' .$row['desig_name'].'</option>'; } ?> </select> </div> <div class="col-lg-6"> <label > Division</label> <select name="division" class="form-control" required=""> <option value="">--Select your division--</option> <?php $sqli="SELECT * FROM division"; $result=mysqli_query($db,$sqli); while($row = mysqli_fetch_array($result)) { echo '<option>' .$row['division_name'].'</option>'; } ?> <!-- <option value="Geomatics ">Geomatics Division</option> <option value="Surface Water">Surface Water Divsion </option> <option value="Ground Water">Ground Water Divsion </option>--> </select> </div> </div> <br> <div class="row"> <div class="col-lg-12"> <label > Principal Investigator</label> <!-- <select name="principal_investigator" class="form-control scrollable-menu" required="" size="4" >--> <input type="text" name="principal_investigator" list="principal_investigator" placeholder="--Select your PI--"/> <datalist id="principal_investigator"> <?php $sqli="SELECT * FROM principleinvestigator "; $result=mysqli_query($db,$sqli); while($row = mysqli_fetch_array($result)) { echo '<option>' .$row['principal_investigator'].'</option>'; } ?> </datalist> <!-- </select>--> </div> </div> <br> <div class="row"> <div class="col-lg-6"> <label > Project Code</label> <input type="text" name="project_code" id="project_code" class="form-control" required=""/> </div> <div class="col-lg-6"> <label >Email </label> <input type="email" name="mail_id" id="mail_id" class="form-control" required=""/> </div> </div> <br> <div class="row"> <div class="col-lg-6"> <label > Valid From</label> <input type="date" name="valid_from" id="valid_from" class="form-control" required=""/> </div> <div class="col-lg-6"> <label > Valid To</label> <input type="date" name="valid_to" id="valid_to" class="form-control" required=""/> </div> </div> <br> <div class="row"> <div class="col-lg-6"> <label > Mobile</label> <input type="text" name="mobile" id="mobile" class="form-control" required=""/> </div> <div class="col-lg-6"> <label > Phone / Emergency Contact</label> <input type="text" name="phone" id="phone" class="form-control" required=""/> </div> </div> <br> <label > Address</label> <!-- <textarea name="address" id="address" tabindex="15" class="form-control"></textarea>--> <input type="text" name="address" id="address" maxlength = "150" class="form-control" placeholder="Use comma and a space between address fields. Maximum 100 characters" required=""/> <br> <!-- <div class="row"> <label >Select your Photo</label> <input type="file" value="Choose photo" accept="image/*" name="photo" id="photo" class="upload-box" onchange="validateImage()"/> </div> <div class="row"> <input type="submit" value=" Preview your form" name="login_button" id="login_button" class="upload-box" /> </div> --> <div class="row"> <div class="col-lg-6"><label >Select your Photo</label></div> <div class="col-lg-6"><label >Preview Your Details</label></div> </div> <div class="row"> <div class="col-lg-6"> <input type="file" value="Choose photo" accept="image/*" name="photo" id="photo" onchange="validateImage()"/> </div> <div class="col-lg-6"> <input type="submit" value=" Preview" name="login_button" id="login_button" /> </div> </div> <div class="row" > <div class="col-lg-8" id="error_msg"> </div> </div> </form> </div> </div> </div> </div> </section> <section class="w3l-footer-29-main"> <div class="footer-29"> <div class="container"> <div class="d-grid grid-col-4 footer-top-29"> <div class="footer-list-29 footer-1" style="margin-top:20px"> <ul> <li><img class="footer-logo" alt="" src="http://cwrdm.org/nexshop/themes/cwrdm/assets/img/footer-widget-logo.png" style="margin-bottom: -25px;"></li> <!-- <li><a href="tel:+7-800-999-800"><span class="fa fa-phone"></span> +(21)-255-999-8888</a></li>--> <li style="color:#FFF; line-height: 1;"><i>(An Institution of Kerala State Council for Science, Technology and Environment, Govt. of Kerala)</span></i> </li> </ul> <!-- <div class="main-social-footer-29"> <a href="#facebook" class="facebook"><span class="fa fa-facebook"></span></a> <a href="#twitter" class="twitter"><span class="fa fa-twitter"></span></a> <a href="#instagram" class="instagram"><span class="fa fa-instagram"></span></a> <a href="#google-plus" class="google-plus"><span class="fa fa-google-plus"></span></a> <a href="#linkedin" class="linkedin"><span class="fa fa-linkedin"></span></a> </div>--> </div> <!-- <div class="col-lg-1 col-md-2 col-xs-12" > </div>--> <div class="footer-list-29 footer-2" style="width: 500px; margin-left:50px"> <h6 class="footer-title-29" style="margin-left:50px">Contact Us</h6> <ul> <li> <p><span class="fa fa-map-marker"></span>Centre for Water Resources Development and Management <br> Kunnamangalam, Kozhikode-673 571 <br> Kerala, India</p></li> <li><a href="tel:+91 495 2351800"><span class="fa fa-phone"></span> +(91) 495 2351800, 2351801, 2351803, 2351804</a></li> <li><a href="mailto:admin@cwrdm.org" class="mail"><span class="fa fa-envelope-open-o"></span> admin@cwrdm.org</a></li> </ul> </div> <div class="footer-list-29 footer-4" style="width: 300px; "> <ul> <h6 class="footer-title-29">Quick Links</h6> <li><a href="form2.php">User Registration</a></li> <li><a href="adminlogin.php">Admin Login</a></li> <li><a href="https://www.cwrdm.org" > www.cwrdm.org</a></li> </ul> <!-- <div class="main-social-footer-29"> <a href="https://www.facebook.com/cwrdmofficial/" target="_blank" class="facebook"><span class="fa fa-facebook"></span></a> <a href="#" class="linkedin"><span class="fa fa-linkedin"></span></a> </div>--> </div> </div> <div class= "d-grid grid-col-2 bottom-copies" style="margin-top: 15px"> <!-- <p class="copy-footer-29" style="margin-left:30px">© 2021 CWRDM. (All rights reserved).</a></p>--> </div> <div class="patent"> © 2021 CWRDM. (All rights reserved) </div> </div> <!-- move top --> <button onclick="topFunction()" id="movetop" title="Go to top"> <span class="fa fa-angle-up"></span> </button> <script> // When the user scrolls down 20px from the top of the document, show the button window.onscroll = function () { scrollFunction() }; function scrollFunction() { if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) { document.getElementById("movetop").style.display = "block"; } else { document.getElementById("movetop").style.display = "none"; } } // When the user clicks on the button, scroll to the top of the document function topFunction() { document.body.scrollTop = 0; document.documentElement.scrollTop = 0; } </script> <!-- /move top --> </section> <body> </html>