Commit 80f5a2a

authored

Merge pull request #48 from AzharAli-github/main

DOM-Form

2 parents eee8d34 + 6675553 commit 80f5a2aCopy full SHA for 80f5a2a

File tree

+58

-0

lines changed

+58

-0

lines changed

Lines changed: 3 additions & 0 deletions

4.15 KB

Lines changed: 30 additions & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,30 @@`
	`1`	`+<!DOCTYPE html>`
	`2`	`+<html lang="en">`
	`3`	`+`
	`4`	`+<head>`
	`5`	`+ <meta charset="UTF-8">`
	`6`	`+ <meta http-equiv="X-UA-Compatible" content="IE=edge">`
	`7`	`+ <meta name="viewport" content="width=device-width, initial-scale=1.0">`
	`8`	`+ <title>DOM FORM</title>`
	`9`	`+ <link rel="stylesheet" href="css/style.css">`
	`10`	`+</head>`
	`11`	`+`
	`12`	`+<body>`
	`13`	`+ <h1>Javascript Form Validation</h1>`
	`14`	`+ <h2>Example One</h2>`
	`15`	`+ <form name="myForm" action="/action_page.php" onsubmit="return validateForm()" method="post">`
	`16`	`+ Name: <input type="text" name="fname">`
	`17`	`+ <input type="submit" value="Submit">`
	`18`	`+ </form>`
	`19`	`+ <h2>Example Two</h2>`
	`20`	`+ <p>Please input a number between 1 and 10:</p>`
	`21`	`+`
	`22`	`+ <input id="numb">`
	`23`	`+`
	`24`	`+ <button type="button" onclick="FunctionOne()">Submit</button>`
	`25`	`+`
	`26`	`+ <p id="textOne"></p>`
	`27`	`+ <script src="script.js"></script>`
	`28`	`+</body>`
	`29`	`+`
	`30`	`+</html>`

Lines changed: 25 additions & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,25 @@`
	`1`	`+// Example One`
	`2`	`+function validateForm() {`
	`3`	`+ let x = document.forms["myForm"]["fname"].value;`
	`4`	`+ if (x == "") {`
	`5`	`+ alert("Name must be filled out");`
	`6`	`+ return false;`
	`7`	`+ }`
	`8`	`+}`
	`9`	`+`
	`10`	`+`
	`11`	`+//Example Two`
	`12`	`+let textOne = document.getElementById('textOne');`
	`13`	`+`
	`14`	`+function FunctionOne() {`
	`15`	`+ // Get the value of the input field with id="numb"`
	`16`	`+ let x = document.getElementById("numb").value;`
	`17`	`+ // If x is Not a Number or less than one or greater than 10`
	`18`	`+ let text;`
	`19`	`+ if (isNaN(x) \|\| x < 1 \|\| x > 10) {`
	`20`	`+ text = "Input not valid";`
	`21`	`+ } else {`
	`22`	`+ text = "Input OK";`
	`23`	`+ }`
	`24`	`+ textOne.innerHTML = text;`
	`25`	`+}`

Comments

(0)