Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

E-cell Task done! #24

Open
wants to merge 5 commits into
base: main
Choose a base branch
from
Open

E-cell Task done! #24

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
caba37e
Task done!!!
Sansgithub22 Jul 13, 2023
5aef6df
Task done!!!
Sansgithub22 Jul 13, 2023
b59b0d9
Task done!!!
Sansgithub22 Jul 13, 2023
59b3219
Task Updated!!!
Sansgithub22 Jul 14, 2023
06010e2
Task Updated!!!
Sansgithub22 Jul 14, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
113 changes: 113 additions & 0 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,113 @@
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Registration Form</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-9ndCyUaIbzAi2FUVXJi0CjmCapSmO7SnpJef0486qhLnuZ2cdeRhO02iuK6FUUVM" crossorigin="anonymous">
</head>

<body>
<section class="vh-100" style="background-color: #eee;">
<div class="container h-100">
<div class="row d-flex justify-content-center align-items-center h-100">
<div class="col-lg-12 col-xl-11">
<div class="card text-black" style="border-radius: 25px;">
<div class="card-body p-md-5">
<div class="row justify-content-center">
<div class="col-md-10 col-lg-6 col-xl-5 order-2 order-lg-1">

<p class="text-center h1 fw-bold mb-5 mx-1 mx-md-4 mt-4">Registration Form</p>

<form class="mx-1 mx-md-4" id="registrationForm">

<div class="d-flex flex-row align-items-center mb-4">
<i class="fas fa-user fa-lg me-3 fa-fw"></i>
<div class="form-outline flex-fill mb-0">
<input type="text" id="name" class="form-control" />
<label class="form-label" for="name">Your Name</label>
</div>
</div>

<div class="d-flex flex-row align-items-center mb-4">
<i class="fas fa-envelope fa-lg me-3 fa-fw"></i>
<div class="form-outline flex-fill mb-0">
<input type="email" id="emailid" class="form-control" />
<label class="form-label" for="emailid">Your Email</label>
</div>
</div>

<div class="d-flex flex-row align-items-center mb-0">
<i class="fas fa-envelope fa-lg me-3 fa-fw"></i>
<select id = "branch" class="select form-outline flex-fill mb-0">
<option value="1" disabled>Branch</option>
<option value="Computer Science And Engineering">Computer Science And Engineering</option>
<option value="Mathematics And Computing">Mathematics And Computing</option>
<option value="Electrical Engineering">Electrical Engineering</option>
<option value="Electronics And Communication">Electronics And Communication</option>
<option value="Civil Engineering">Civil Engineering</option>
<option value="Chemical Engineering">Chemical Engineering</option>

<option value="Mechanical Engineering">Mechanical Engineering</option>

<option value="Metallurgical Engineering">Metallurgical Engineering</option>

<option value="Mining Engineering">Mining Engineering</option>

<option value="Pharmaceutical Engineering">Pharmaceutical Engineering</option>
<option value="Biomedical Engineering">Biomedical Engineering</option>
<option value="Biochemical Engineering">Biochemical Engineering</option>
<option value="Industrial Chemistry">Industrial Chemistry</option>
<option value="Engineering Physics">Engineering Physics</option>

<option value="Ceramics Engineering">Ceramic Engineering</option>

<option value="Architecture, Planning and Design">Architecture, Planning and Design</option>
<option value="Others">Others</option>
</select>
<!-- </div> -->
</div>
<div class="d-flex flex-row align-items-center mb-0">
<i class="fas fa-envelope fa-lg me-3 fa-fw"></i>
<p>Branch</p>
</div>

<div class="d-flex flex-row align-items-center mb-4">
<i class="fas fa-envelope fa-lg me-3 fa-fw"></i>
<div class="form-outline flex-fill mb-0">
<input type="text" id="phone" class="form-control" />
<label class="form-label" for="phone">Phone</label>
</div>
</div>

<div class="d-flex justify-content-center mx-4 mb-3 mb-lg-4">
<button type="submit" class="btn btn-primary btn-lg">Register</button>
</div>

</form>

</div>
<div class="col-md-10 col-lg-6 col-xl-7 d-flex align-items-center order-1 order-lg-2">

<img src="https://mdbcdn.b-cdn.net/img/Photos/new-templates/bootstrap-registration/draw1.webp"
class="img-fluid" alt="Sample image">

</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"
integrity="sha384-geWF76RCwLtnZ8qwWowPQNguL3RmwHVBC9FhGdlKrxdiJJigb/j/68SIy3Te4Bkz"
crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/firebase/7.14.1-0/firebase.js"></script>
<script src="script.js"></script>
</body>

</html>

63 changes: 63 additions & 0 deletions script.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,63 @@
const firebaseConfig = {
apiKey: "AIzaSyA0hA2Bc74PEzeuoahNApERIEkxFqv_jSo",
authDomain: "techteamexpansion23.firebaseapp.com",
projectId: "techteamexpansion23",
storageBucket: "techteamexpansion23.appspot.com",
messagingSenderId: "542718392377",
appId: "1:542718392377:web:bf6178e1b28494fe8c35e8",
measurementId: "G-39B1R2EWV2"
};


firebase.initializeApp(firebaseConfig);
const db = firebase.firestore();

const collectionName = 'SANSKRUTI_CSE';
document.getElementById("registrationForm").addEventListener("submit", submitForm);
function validateInputs(name, email, branch, phone) {
// Validate name
var nameRegex = /^[a-zA-Z]+$/;
if (!nameRegex.test(name)) {
alert("Wrong Name Input | Registration Failed");
return false;
}
var emailRegex = /^[a-zA-Z0-9.+_-]+@[a-zA-Z0-9._-]+\.[a-zA-Z]+$/;
if (!emailRegex.test(email)) {
alert("Wrong Email Input | Registration Failed");
return false;
}
var phoneRegex = /^\d{10}$/;
if (!phoneRegex.test(phone)) {
alert("Wrong Phone Input | Registration Failed");
return false;
}
return true;
}
function submitForm(e) {
e.preventDefault();

var name = getElementVal("name");
var emailid = getElementVal("emailid");
var branch = getElementVal("branch");
var phone = getElementVal("phone");
const formData = {
name: name,
email: emailid,
branch: branch,
phone: phone
};

var check = validateInputs(name, emailid, branch, phone);
if (check) {


db.collection(collectionName).add(formData);
alert("Registration Successful");
}

document.getElementById("registrationForm").reset();
}

const getElementVal = (id) => {
return document.getElementById(id).value;
};