Train no /th> th< rowspan="2">Train Name /th> th< colspan="2" >Timing /th>
tr> th >arrive /th> th>depacter /th> /tr>
tabl
title>Student Registration Form/title>
link rel="stylesheet" href="styles.css">
/head>
body bgcolor="">
center>
h1>STUDENT REGISTRATION FORMs/h1>
/center>
form action="#" method="post">
table border="1" align="center" cellpadding="10px" cellspacing="1px" width="70%">
!-- First Name Section -->
tr>
td>NAME/td>
td>
input type="text" name="" maxlength="3" placeholder="30 leeter tak" >
(max 30 characters a-z and A-Z)
/td>
/tr>
!-- Course Applied For Section -->
tr>
td>Course Applied for/td>
td>
select name="course">
option value="MCA">MCA/option>
option value="BCA">BCA/option>
option value="PGDCA">PGDCA/option>
option value="OLEVEL">OLEVEL/option>
/select>
/td>
!-- Gender Section -->
tr>
td>GENDER/td>
td>
input type="radio" name="Gender" value="Male" /> Male
input type="radio" name="Gender" value="Female" /> Female
/td>
/tr>
!-- Hobbies Section -->
tr>
td>HOBBIES/td>
td>
input type="checkbox" name="Hobby" value="Drawing" /> Drawing
input type="checkbox" name="Hobby" value="Singing" /> Singing
input type="checkbox" name="Hobby" value="Dancing" /> Dancing
input type="checkbox" name="Hobby" value="Sketching" /> Sketching
/td>
/tr>
!-- Address Section -->
tr>
td>ADDRESS/td>
td>
textarea name="Address" rows="5" cols="30">/textarea>
/td>
/tr>
!-- Submit and Reset Buttons -->
tr>
td colspan="2" align="center">
input type="button" value="Submit" />
input type="reset" value="Reset" />
button type="button">Submit /button>
/td>
/tr>
/table>
/form>
lisss
ol type="1" start="1">
li>Coffee/li>
li>Tea/li>
ul>
ul type="circle">
li>Black Tea/li>
li>Green Tea/li>
/ul>
/ul>
li>Milk/li>
/ol>
target
html>
head>
title>Link to Google page/title>
/head>
body>
p>
a href="https://google.co.in" target="_blank"> Google /a>
/p>
/body>
/html>
Student Registration with JS Validation
style>
td:nth-child(even){
background-color:lightblue ;
}
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
background-color: #f4f6f9;
margin: 0;
padding: 40px 20px;
}
.form-card {
max-width: 450px;
background: #ffffff;
padding: 30px;
margin: 0 auto;
border-radius: 10px;
box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.08);
}
h2 {
text-align: center;
color: #2c3e50;
margin-bottom: 25px;
}
.input-box {
margin-bottom: 18px;
}
label {
display: block;
font-weight: 600;
margin-bottom: 6px;
color: #34495e;
}
input[type="text"], input[type="email"], select {
width: 100%;
padding: 10px;
border: 1px solid #ccc;
border-radius: 6px;
box-sizing: border-box;
font-size: 14px;
}
input[type="text"]:focus, input[type="email"]:focus, select:focus {
border-color: #3498db;
outline: none;
}
.gender-container {
margin-top: 5px;
}
.error-text {
color: #e74c3c;
font-size: 12px;
margin-top: 4px;
font-weight: 500;
display: none; /* Hidden by default */
}
.btn-submit {
width: 100%;
background: #2ecc71;
color: white;
padding: 12px;
border: none;
border-radius: 6px;
font-size: 16px;
font-weight: bold;
cursor: pointer;
transition: background 0.2s ease;
}
.btn-submit:hover {
background: #27ae60;
}
/style>
/head>
body>
div class="form-card">
h2>Registration Form/h2>
!-- JavaScript intercepts submission using onsubmit -->
form id="regForm" onsubmit="return checkValidation()">
!-- Name Field -->
div class="input-box">
label>Full Name/label>
input type="text" id="studentName" placeholder="Enter full name">
div id="nameErr" class="error-text">Please enter a valid name (Alphabets only)./div>
/div>
!-- Email Field -->
div class="input-box">
label>Email Address/label>
input type="email" id="studentEmail" placeholder="example@mail.com">
div id="emailErr" class="error-text">Please enter a valid email address./div>
/div>
!-- Course Selection -->
div class="input-box">
label>Select Course/label>
select id="studentCourse">
option value="">-- Choose Course --/option>
option value="BCA">BCA/option>
option value="MCA">MCA/option>
option value="BTech">B.Tech/option>
/select>
div id="courseErr" class="error-text">Please select a course from the list./div>
/div>
!-- Gender Selection -->
div class="input-box">
label>Gender/label>
div class="gender-container">
input type="radio" name="userGender" value="Male" id="gMale"> Male
input type="radio" name="userGender" value="Female" id="gFemale"> Female
/div>
div id="genderErr" class="error-text">Please select your gender./div>
/div>
!-- Submit Button -->
button type="submit" class="btn-submit">Register Now/button>
/form>
/div>
script>
function checkValidation() {
// Hide all previous error messages
let errors = document.getElementsByClassName('error-text');
for (let i = 0; i errors.length; i++) {
errors[i].style.display = 'none';
}
let status = true;
// 1. Name Validation (Checks for empty string and letters only)
let uName = document.getElementById('studentName').value.trim();
let nameCheck = /^[a-zA-Z\s]+$/;
if (uName === "" || !nameCheck.test(uName)) {
document.getElementById('nameErr').style.display = 'block';
status = false;
}
// 2. Email Validation (Regex pattern verification)
let uEmail = document.getElementById('studentEmail').value.trim();
let emailCheck = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
if (uEmail === "" || !emailCheck.test(uEmail)) {
document.getElementById('emailErr').style.display = 'block';
status = false;
}
// 3. Course Validation (Checks if default option is selected)
let uCourse = document.getElementById('studentCourse').value;
if (uCourse === "") {
document.getElementById('courseErr').style.display = 'block';
status = false;
}
// 4. Gender Validation (Checks if at least one radio button is checked)
let isMale = document.getElementById('gMale').checked;
let isFemale = document.getElementById('gFemale').checked;
if (!isMale && !isFemale) {
document.getElementById('genderErr').style.display = 'block';
status = false;
}
// Final Validation Decision
if (status === true) {
alert("Form submitted successfully! Data is valid.");
return true;
} else {
return false; // Blocks form submission and prevent page refresh
}
}
/script>
change ho gya
p> id="pa">Test p change /p>
button onclick="clifunc()">click karke dekho /button>
script>
function clifunc(){ document.getElementById('pa').innerHTML="change ho gya n"
}
/script>
djjjjjjjjjj--------------------------------------
_djstyle>
.form-container {
max-width: 450px;
background: #fff;
padding: 25px;
margin: auto;
border-radius: 8px;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}
h2 {
text-align: center;
color: #333;
margin-bottom: 20px;
}
.form-group {
margin-bottom: 15px;
}
label {
display: block;
font-weight: bold;
margin-bottom: 5px;
}
input {
width: 100%;
padding: 8px;
box-sizing: border-box;
border: 1px solid #ccc;
border-radius: 4px;
}
.error-message {
color: red;
font-size: 13px;
display: block;
margin-top: 5px;
}
button {
width: 100%;
padding: 10px;
background-color: #28a745;
color: white;
border: none;
border-radius: 4px;
font-size: 16px;
cursor: pointer;
}
button:hover {
background-color: #218838;
}
_dj/style>
_dj/head>
_djbody>
_djdiv class="form-container">
_djh2>Student Admission Form_dj/h2>
_djform id="admissionForm" novalidate>
_dj!-- Student Name -->
_djdiv class="form-group">
_djlabel for="studentName">Student Name:_dj/label>
_djinput type="text" id="studentName">
_djspan id="nameError" class="error-message">_dj/span>
_dj/div>
_dj!-- Mobile Number -->
_djdiv class="form-group">
_djlabel for="mobileNumber">Mobile Number:_dj/label>
_djinput type="text" id="mobileNumber">
_djspan id="mobileError" class="error-message">_dj/span>
_dj/div>
_dj!-- Email ID -->
_djdiv class="form-group">
_djlabel for="emailId">Email ID:_dj/label>
_djinput type="text" id="emailId">
_djspan id="emailError" class="error-message">_dj/span>
_dj/div>
_dj!-- Course -->
_djdiv class="form-group">
_djlabel for="course">Course:_dj/label>
_djinput type="text" id="course">
_djspan id="courseError" class="error-message">_dj/span>
_dj/div>
_dj!-- Password -->
_djdiv class="form-group">
_djlabel for="password">Password:_dj/label>
_djinput type="password" id="password">
_djspan id="passwordError" class="error-message">_dj/span>
_dj/div>
_dj!-- Confirm Password -->
_djdiv class="form-group">
_djlabel for="confirmPassword">Confirm Password:_dj/label>
_djinput type="password" id="confirmPassword">
_djspan id="confirmPasswordError" class="error-message">_dj/span>
_dj/div>
_djbutton type="submit">Submit_dj/button>
_dj/form>
_dj/div>
_djscript>
document.getElementById("admissionForm").addEventListener("submit", function(event) {
event.preventDefault();
let errors = document.querySelectorAll(".error-message");
errors.forEach(error => error.textContent = "");
let isValid = true;
let name = document.getElementById("studentName").value.trim();
let mobile = document.getElementById("mobileNumber").value.trim();
let email = document.getElementById("emailId").value.trim();
let course = document.getElementById("course").value.trim();
let password = document.getElementById("password").value;
let confirmPassword = document.getElementById("confirmPassword").value;
// 1. Student Name Validation
if (name === "") {
document.getElementById("nameError").textContent = "Student Name is required.";
isValid = false;
}
// 2. Mobile Number Validation
let mobilePattern = /^[0-9]{10}$/;
if (mobile === "") {
document.getElementById("mobileError").textContent = "Mobile Number is required.";
isValid = false;
} else if (!mobilePattern.test(mobile)) {
document.getElementById("mobileError").textContent = "Mobile Number must contain exactly 10 digits.";
isValid = false;
}
// 3. Email ID Validation
let emailPattern = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,6}$/;
if (email === "") {
document.getElementById("emailError").textContent = "Email ID is required.";
isValid = false;
} else if (!emailPattern.test(email)) {
document.getElementById("emailError").textContent = "Please enter a correct Email format.";
isValid = false;
}
// 4. Course Validation
if (course === "") {
document.getElementById("courseError").textContent = "Course is required.";
isValid = false;
}
// 5. Password Validation
if (password === "") {
document.getElementById("passwordError").textContent = "Password is required.";
isValid = false;
}
// 6. Confirm Password Validation
if (confirmPassword === "") {
document.getElementById("confirmPasswordError").textContent = "Please confirm your password.";
isValid = false;
} else if (password !== confirmPassword) {
document.getElementById("confirmPasswordError").textContent = "Password and Confirm Password must match.";
isValid = false;
}
if (isValid) {
alert("Admission Form Submitted Successfully!");
document.getElementById("admissionForm").reset();
}
});
_dj/script>
_dj/body>
_dj/html>
--------------------------------------------
---
js mutification and division
_djscript>
var num1=Number(prompt("Enter the first number"));
var num2=Number(prompt("Enter the Second number"));
var mulitply= num1*num2;
var division= num1/num2;
alert("Multiplication"+ mulitply + "\n division "+ division)
_dj/script>
prompt wala
_djp id="i">_djbr>_dj/p>
_djp id="i2">_dj/p>
_djscript>
var a=Number(prompt("tipa Number 1"));
var b=Number(prompt("tipa 2"));
var sum=a+b;
var div=a*b;
document.getElementById("i").innerHTML= "jod =" + sum;
document.getElementById("i2").innerHTML= "bhag=" + div;
_dj/script>
marquees direction="left">text
footer>Copyright & copys footer
|