If I enter numbers outside the range of the number input, I will see an HTML5 validation error.'

HTML-CSS
1

Hello all, I’m working on the Survey Form project and am requesting some help. I’ve been receiving the error above, and can’t seem to get past it.

my CodePen link: https://codepen.io/algala-droid/pen/WNQXeBN

Any help provided is greatly appreciated, thank you-

2

There are min and max attributes for input elements of type number for defining the range of values within which input values are expected to lie.

1 Like
3

@nibble not sure I quite follow

4 
<input type = number  min = 4   max = 7 >

The input above will only accept numbers from 4 to 7. That is what you are expected to include in your input element of type number as per the instruction.

2 Likes
5

makes sense and I tried it, but it still won’t work.

6 

 <form id ="survey-form"> 
    <input id ="name"required>
    <input type ="email" id = "email" required>
    <input type="number" id = "number"  min = 10  max = 100 required>    
   </form>

Copy and paste the above code in place of your form element and notice the difference.

4 Likes
7

the input involved in the error is the one with id of #number on line 11

<input type="number" id = "number"required>

you have not changed that one, instead it seems you tried to create a new one, on line 25

<Input type= number min=8 max=23>

delete this last one, and add the min and max attributes to the other one

Also, you need to put the script tag of the test suite as last thing on your html box, not inside div elements

2 Likes
8

@nibble, thank you. I tried your code and it works, guess I just need more practice and to really understand the structure. I really appreciate your help-

9

Take a look at @ILM’s response above as well.

10

@ILM, thank you for pointing this out. I was beginning to think I had to edit the rest of my form element code. Appreciate it much-

11

@ILM, I removed the duplicate form element and changed line 11. I didn’t know the test script needed to go outside of the html code. Thanks again-

12

Hey Nibble and guys, how are you? I applied something similar as you said (and it is my line of thinking too to solve this problem) but the error persists in my code…I really confused about this request, can you give a look at my code and see if something is wrong with that? - https://codepen.io/henriquecd-tech/pen/JjKepYE

p.s: I am from brazil, sorry if is something wrong with my English.

I will appreciate any kind of help.

13

@henriquecd-tech It is better if you open your own thread.

Anyway, the test is looking for the min and max attributes on the element with id="number".

1 Like