<form class="myForm" style="max-width: 200px; margin: auto;">
<p>Enter your first name:</p>
<input id="firsName" style="margin-bottom: 20px; margin-top: 2px;" type="text"
placeholder="F_Name">
<p>Enter your second name:</p>
<input id="secondName" style="margin-bottom: 20px; margin-top: 2px;" type="text"
placeholder="S_Name"><br>
<p>Enter your email:</p>
<input id="email" style="margin-bottom: 20px; margin-top: 2px;" type="email"
placeholder="Email: ">
<p>Enter your password:</p>
<input id="password" style="margin-bottom: 20px; margin-top: 2px;" type="password"
placeholder="Password: "><br>
<p><input id="checkbox" type="checkbox">I am not Robot</p>
<input onclick= "formSubmission(firsName, secondName, email, password, checkbox)"
type="submit" value="Submit">
</form>
<script>
//*********************** If If-else Statement *********************
const formRecord = []
const formSubmission = (fName, sName, email, pswd, checkbox) =>{
if (fName.value){
if (fName.value.length <= 10){
if (fName.value.match(/^[A-Za-z]+$/) ){
formRecord.push(`First Name : ${fName.value}`)
}
else{
alert(`First Name need just characters!`)
}
}
else{
alert(`First Name need length of just 10 characters!`)
}
}
else{
return alert(`Please fill the area of first Name!`)
}
if(sName.value){
if (sName.value.length <= 10){
if (sName.value.match(/^[A-Za-z]+$/)){
formRecord.push(`Second Name : ${sName.value}`)
}
else{
alert(`Second Name need just characters!`)
}
}
else{
alert(`Second Name need length of just 10 characters!`)
}
}
else{
return alert(`Please fill the area of second Name!`)
}
if (email.value){
formRecord.push(`Email : ${email.value}`)
}
else{
return alert(`Please fill the area of email!`)
}
if (pswd.value){
if (pswd.value.length >= 8){
formRecord.push(`Password : ${pswd.value}`)
}
else{
alert(`Password must contain 8 or more characters!`)
}
}
else{
return alert(`Please fill the area of password!`)
}
if (checkbox.value){
true
}
else{
false
}
const userVerification = (checkbox)=>{
if (checkbox.value){
return alert(`Congratulation! User is Verified!`)
}
else{
return alert(`!!User is not Verified!!`)
}
}
let btn = document.getElementById("checkbox")
let html = `<h2 style='max-width: 200px; margin: auto;'>User Info</h2><br>`
html += `<div style="max-width: 280px; margin: auto;"><ul type='circle'>`
formRecord.forEach((user)=>{
html += `<li>${[user]}</li>`
})
html += `</ul><button id='userVerified' type='submit'
onclick='userVerification(btn)'>Check if the user is verified or not!</button></div>`
document.write(html)
}
</script>
In this code i took user`s some info as input and wanted to check if the user is verified or not, i made html-form and in form i also made one input of type checkbox as 'I'm not robot'. and made a small function in which i set the condition that if the checkbox have value then return 'user is verified' else return 'user is not verified'. This whole code worked well but except the part of checking the user verification that if the user is verified or not! Now Please tell me where is mistake?
Aucun commentaire:
Enregistrer un commentaire