SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Member
    Join Date
    May 2014
    Posts
    9
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Button tag is the value attribute needed

    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?
    PHP Code:
    <button type="submit" name="Action" value="Save my changes" class="button">Save my changes</button

  2. #2
    SitePoint Zealot
    Join Date
    Aug 2011
    Location
    Amsterdam, The Netherlands
    Posts
    167
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    I don't think that will validate, and it might even cause practical problems in some browsers. Here are the three options that are valid and that will work cross-browser:

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

    Code HTML5:
    <input type="button" name="Action" value="Save my changes" class="button" onclick="submitForm()"> 
     
    <script>
    function submitForm() {
         yourFormName.submit();
    }
    </script>

    Code HTML5:
    <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.
    How to: Target IE in, Position in, Center in,
    Create a Fixed ('Sticky') Footer with,
    and Create a Drop-Down/Fly-Out Menu with CSS:
    Conijn Webdesign Amsterdam.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •