Hi guys,
I was wondering if you could help me out with my phone number and email input forms. So I’m almost done with the form but I need the ‘number’ field to only take 10 numbers and the ‘email’ section to only take emails. How would I do that? I’ve already tried the min/max method for the phone number. I’ve also tried to implement the ‘pattern’ attribute for the phone number but that doesn’t seem to be working either. I’m not sure where to start with the email field. Can someone give me a hand?
Do you know any javascript? Or is this strictly html and css? IF you can use javascript I would say use Regex to help you out with the inputs.
Also I noticed in your inputs are a little weird. You are using p tags to make text names for your inputs. I would use the label tag instead.
I know some Javascript just have a hard time implementing it if that makes any sense. I’ll adjust the paragraphs to for label tags.
Javascript is worth learning if you are looking into the front end side of the development. You really cant escape it. Another note is your password input is holding the id of email. Want to change that.
the pattern attribute as far as I know will allow the user to enter more numbers in the input area, but wont submit unless it is within the required number
Country code: <input type="text" name="country_code" pattern="[A-Za-z]{3}" title="Three letter country code">
<input type="submit">
The user will still be able to enter more than 3 characters, but wont submit. Something pulled off w3schools
Oh I’m for sure trying to learn JS I’m just in ‘console log hell’ lol. Trying to figure out the DOM so I can connect the HTML and CSS to Javascript.
I gotcha. Yea, it can be a headache for sure. Well pattern is already a regex that you will learn more in the data structures lesson I believe.
As far as the email goes as long as type is sent to email the user will have to follow email syntax. Meaning @ and .com will have to be present or it will give the user a little message
1 Like