FAQ: Learn HTML: Form Validation - Set a Minumum and Maximum

This community-built FAQ covers the “Set a Minumum and Maximum” exercise from the lesson “Learn HTML: Form Validation”.

Paths and Courses
This exercise can be found in the following Codecademy content:

Introduction to HTML

FAQs on the exercise Set a Minumum and Maximum

Join the Discussion. Help a fellow learner on their journey.

Ask or answer a question about this exercise by clicking reply (reply) below!

Agree with a comment or answer? Like (like) to up-vote the contribution!

Need broader help or resources? Head here.

Looking for motivation to keep learning? Join our wider discussions.

Learn more about how to use this guide.

Found a bug? Report it!

Have a question about your account or billing? Reach out to our customer support team!

None of the above? Find out where to ask other questions here!

how can we set rules for range type of input field ? and what rules can we set for it?
thanks :thinking::thinking::slightly_smiling_face:

3 posts were split to a new topic: My code doesn’t display a warning?

I checked the javascript code for this to see how it works and i have a question i can kinda seem to understand the lines of code except for line excpet for line 2 in numCheck.js where it says const guess = new

I looked around in the other files and i dont know where new was defined or located when I erase it the whole code stops working can anyone please explain to me what this line of code does

Why are we able to have to inputs under the same label? How do they know to combine to each other?

The label identifies the element it is bound to. for is bound to id. Normal flow rules apply.

1 Like

3 posts were split to a new topic: Is it possible to style the error message?

9 posts were split to a new topic: What order do attributes need to be in?

Is it possible to change min and max values in the browser’s code inspector to submit another value? Would it work?

The input field changed size after I set the min="1" max="10" values. Why is that? Is that standard behaviour, or is there some css/js/something working here, that I cannot see?

In this exercise HTML method is “GET”, previously we have used only “POST”. What is the difference between them two and why in this case we are using “GET”?

You’ll find articles and videos on their difference in the following SERP…

https://www.google.com/search?q=GET+vs+POST

I understand that a label is connected to input via for and id attributes. But when we use a submit button, then that means using an input with the type="submit", so how does it connect to a label or to the input text field right next to it? I mean we click it and only the field right next to it responds. How does it happen?

Submit is a special type of input that triggers an event, onsubmit which then fires the handler. The handler parses the form data and builds a header for the request that contains all the fields assigned to the name we give them.

<input name="info" value="user info">

becomes,

info="user info"

Because by default Submit has its own visual presentation and text, it does not need, nor should have a label. Only other inputs should have labels.

1 Like

image
In the code don’t we need a step attribute with the number to have an up and down arrows?

It is taken care of by the number type.

1 Like

I tried to use min=1 and min=“1” and they both worked. Why do we need the quotation marks if it works without em?

Convention and consistency, and, clean markup. Attribute values in HTML 4 didn’t need quotes, but when XHTML came along they became mandatory. HTML5 is largely built on the latter model, but does validate with less strict code. It’s better to stay on the side of strictness.

What’s the difference between the “type= range” input and the “type= number” input when specifying a min or max value for your form? Are they interchangeable?

The fact they are different types would imply differences, though there may be some overlap. It would be unsafe to assume they are the same thing. We can get the same output, though, if we give the correct parameters to each. One is a slider that we set a range on (that is, lowest and highest value) and the other is a form control that has built in numbers with up and down buttons, again for which we set a lowest and highest value).

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/range

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/number