Button tag is the value attribute needed

HTML & CSS
1

Hi,

Apologies if this has been answered before, did a quick search.

For best practice should I be using the value attribute on buttons (html 5 page). It seams wrong to duplicate the text in the button tag as the value attribute. Does it make any difference if the button has a name attribute?

<button type="submit" name="Action" value="Save my changes" class="button">Save my changes</button>
2

I don’t think that will [U]validate[/U], and it might even cause practical problems in some browsers. Here are the three options that are valid and that will work cross-browser:


<input type="submit" name="Action" value="Save my changes" class="button">  



<input type="button" name="Action" value="Save my changes" class="button" onclick="submitForm()"> 

<script>
function submitForm() {
     yourFormName.submit();
}
</script> 



<button type="button" name="Action" class="button" onclick="submitForm()">Save my changes</button> 

<script>
function submitForm() {
     yourFormName.submit();
}
</script>

At which I’m wondering why you gave the submit button a name. I copied it, so as to complicate matters as little as possible, but I don’t see a use for it if it concerns a submission button. If you did so to style the button, you can and should use id=“Action” instead. And you should rename the class name ‘button’ with something else, because ‘button’ is an HTML tag name. That can easily cause confusion and thus coding errors.

Hope this helps.

3

it is not needed in your case.
Some, but not all, UA’s can use the value of the element to fill in the button if no text is present.

it’s worthy of note that giving a value to a submit button might be useful, supposing you have other submit-action buttons. You can then know via which buttony he form was submitted by the value that is passed.