Why is submit lowercase in type but capitalized in value?

In the “Solution”, why is the word “submit” capital in value vs the type as shown below:

Solution: < input type=“submit” value=“Submit” >

Answered my own question, but this may help others.

The reasoning for the Caps in “value=“Submit”” is because that is the part that is going to show up on the “button” on the webpage.

15 Likes

yes, exactly. The value attribute is used to set the text (value) of a button. Then its common to use make the first letter of the first word upper case (normal grammar rules)

12 Likes

Ok but if there is no value attribute , then the button has a text of “Submit” which is also capitalized . So is this common ?Can I change the default value of the button somehow?

well, if you don’t use the value attribute, you get a default value. This will vary, in chrome the default is Submit but in Firefox the default is Submit Query, so setting a value to ensure consistency is a good idea

5 Likes

Oh thanks for the answer.

Hey when creating my submit button i accidentally used name instead of value, i assumed i would get an error but it worked fine. Is there an explanation as to why name worked and why i wouldn’t use it. Just for my knowledge.

I’ll try to explain properly what is actually happening here.

First, ‘is there an explanation as to why name worked’?
Put simply, there is actually no reason why your code shouldn’t worked. The name attribute’s primary function is to identify the form control in a form submission, that’s why it can be used on any type of form control (input, textarea, select, etc, …).
Aside, and to be even more precise, even if the name’s attribute isn’t a global attribute (a global attribute can be used by any HTML element) one can still use it on most HTML elements. It’s simply not recommanded to do so because its standard behavior is focused on form control element and using it on other element could potentially create unwanted effects / behaviors.

So if you did something like this:

<input type="submit" id="send" name="submit">

You did nothing wrong, all you did was ask the browser to send the name attribute’s value (here ‘submit’) to the server once the form is submitted. But if that’s the case then what of the value attribute? Well if you omit the value attribute on an input element with a type attribute’s value of ‘submit’ the text that will appear on the button will depend on the user’s browser and user’s brower settings (like language for example). In modern browsers, the default text is ‘Submit’ but you can also have default text set on ‘Send’ or ‘Ok’.

And that is why your code ‘worked fine’. Which actually demonstrate something i find fascinating in programming: ‘Getting the expected result doesn’t necessarily mean your code works the way you actually think it is.’

1 Like