Last active
March 29, 2022 08:03
-
-
Save afro-coder/91cb995edd111070bc5d19bb45c7e06e to your computer and use it in GitHub Desktop.
IT html programs
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- | |
Program to accept Student ID (combination of alphabets an numbers), | |
date of joining Collige, percentage in previous class (in digits) | |
The data should be sent to the server. | |
--> | |
<html> | |
<head> | |
<title>HTML question 1</title> | |
</head> | |
<body> | |
<form> | |
<!-- This will only take Alphabets A-Z and numbers 0-9 for example Allie024 is valid but Allie#012 is not | |
How this works is the patter specified "[a-zA-Z0-9]+" will match A-Z or a-z or numbers 0-9 | |
the "[]" means individually and not as a group the "+ means one or more" | |
https://stackoverflow.com/questions/62285091/how-to-only-allow-alphanumeric-on-textbox-using-pure-html | |
--> | |
<!-- The Required attribute will not let you submit until all the fields are filled --> | |
<!-- Other Input types are given here https://developer.mozilla.org/en-US/docs/Learn/Forms/HTML5_input_types --> | |
Student ID: <input type="text" id="studentID" name="studentID" pattern="[a-zA-Z0-9]+" title="Only numbers and Alphabets" required> <br/> | |
<br/> | |
<!-- Input Type date shows a date selector to select date--> | |
Date of Joining: <input type="date" id="date" name="date" title="Date" required > <br/> | |
<br/> | |
<!-- Input type number will only let you select numbers you can also set min and max below Minimum and Maximum is optional--> | |
Percentage(In numbers): <input type="number" id="onlynumber" name="onlynumber" title="Percentage(In Digits)" required min=0 max=100> </br> | |
<br/> | |
<!-- The Submit Button --> | |
<input type="submit" name="submit" value="submit"> | |
</form> | |
</body> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- | |
Program to accept &mail ID of the Hotel, Date of foundation Number of tables in hotel The data should be sent to the server. | |
--> | |
<html> | |
<head> | |
<title>HTML question 2</title> | |
</head> | |
<body> | |
<form> | |
<!-- The Required attribute will not let you submit until the fields are filled --> | |
<!-- Other Input types are given here https://developer.mozilla.org/en-US/docs/Learn/Forms/HTML5_input_types --> | |
Email ID: <input type="email" id="emailID" name="emailID" title="Email" required> <br/> | |
<br/> | |
<!-- Input Type date shows a date selector to select date--> | |
Date of Foundation: <input type="date" id="date" name="date" title="Date" required > <br/> | |
<br/> | |
<!-- Input type number will only let you select numbers you can also set min and max below Minimum and Maximum is optional--> | |
Number of tables: <input type="number" id="onlynumber" name="onlynumber" title="Number of Tables" required> </br> | |
<br/> | |
<!-- The Submit Button --> | |
<input type="submit" name="submit" value="submit"> | |
</form> | |
</body> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- | |
Program to accept student name Date of birth & attendance percentage in number form. The data should be sent to the serwer | |
--> | |
<html> | |
<head> | |
<title>HTML question 3</title> | |
</head> | |
<body> | |
<form> | |
<!-- The Required attribute will not let you submit until the fields are filled --> | |
<!-- Other Input types are given here https://developer.mozilla.org/en-US/docs/Learn/Forms/HTML5_input_types --> | |
<!-- Accept only Names--> | |
Student First Name: <input type="text" id="firstname" pattern="[a-zA-Z]+" name="FirstName" title="First Name" required> <br/> | |
<br/> | |
Student Last Name: <input type="text" id="lastname" pattern="[a-zA-Z]+" name="LastName" title="Last Name" required> <br/> | |
<br/> | |
<!-- Input Type date shows a date selector to select date--> | |
Date of Birth: <input type="date" id="date" name="date" title="Date" required > <br/> | |
<br/> | |
<!-- Input type number will only let you select numbers you can also set min and max below Minimum and Maximum is optional--> | |
Attendance Percentage(In numbers): <input type="number" id="onlynumber" name="onlynumber" title="Percentage(In Digits)" required min=0 max=100> </br> | |
<br/> | |
<!-- The Submit Button --> | |
<input type="submit" name="submit" value="submit"> | |
</form> | |
</body> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- | |
program to accept Name of College, Total number of students in the college, total number of halls (range till 100 should be sent to the server. | |
--> | |
<html> | |
<head> | |
<title>HTML question 4</title> | |
</head> | |
<body> | |
<form> | |
<!-- The Required attribute will not let you submit until the fields are filled --> | |
<!-- Other Input types are given here https://developer.mozilla.org/en-US/docs/Learn/Forms/HTML5_input_types --> | |
<!-- Accept only Names--> | |
College Name: <input type="text" id="firstname" pattern="[a-zA-Z]+" name="FirstName" title="Name" required> <br/> | |
<br/> | |
<!-- Input Type date shows a date selector to select date--> | |
Total number of Students: <input type="number" id="num" name="num" title="num" required > <br/> | |
<br/> | |
<!-- Input type number will only let you select numbers you can also set min and max below Minimum and Maximum is optional--> | |
Total Number of Halls: <input type="number" id="hall" name="hall" title="hall" required min=0 max=100> </br> | |
<output class="hall-output" for="hall"></output> | |
<br/> | |
<!-- The Submit Button --> | |
<input type="submit" name="submit" value="submit"> | |
</form> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment