SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Zealot
    Join Date
    Feb 2009
    Posts
    194
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Best way to tag 'action' links

    On a lot of sites, especially those that are more app-like and interactive.. there are a lot of links that perform actions like 'delete' 'log out' etc. Sometimes it's appropriate for them to look like regular links, but often they want their own class, and don't make sense as 'paragraphs' (At least not to me!)

    So how do you go about tagging these types of things? what element? do you have a universal class you always use for them?

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,299
    Mentioned
    460 Post(s)
    Tagged
    8 Thread(s)
    Normally they will either be an <a> link or a <submit> button. What you nest these in is up to you, really. But if an <a> link is on its own, it should be wrapped in a block element, and a <p> is usually a good option.

  3. #3
    Non-Member Kalon's Avatar
    Join Date
    Aug 2010
    Location
    At my computer
    Posts
    2,012
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    another option is the <button> element which gives you more options with it's content and styling.

  4. #4
    SitePoint Wizard bronze trophy
    Join Date
    Jul 2006
    Location
    Augusta, Georgia, United States
    Posts
    4,182
    Mentioned
    16 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by cutcopypaste
    On a lot of sites, especially those that are more app-like and interactive.. there are a lot of links that perform actions like 'delete' 'log out' etc. Sometimes it's appropriate for them to look like regular links, but often they want their own class, and don't make sense as 'paragraphs' (At least not to me!)

    So how do you go about tagging these types of things? what element? do you have a universal class you always use for them?
    Normally I use a input and class it as the action. Buttons don't work well because IE6/7 submit all buttons on the page. Which means if someone clicks a delete "button" everything will be deleted by default.

    HTML Code:
    <input type="submit" class="delete" name="frmBlogs[action][delete][34]" value="Delete">
    <input type="submit" class="delete" name="frmBlogs[action][delete][35]" value="Delete">
    <input type="submit" class="delete" name="frmBlogs[action][delete][12]" value="Delete">
    Inputs not pressed are not submitted. So using some array manipulation and flipping the "label" can be kept completely decorative.

    Inputs can be styled like any other element can be. The only issue will be hover in IE6 though that could be rectified using JavaScript or not all since its not relevant to the function itself.

    Buttons are best avoided, unless used only with JavaScript and handled manually using event listeners because of the difference in how IE handles them – submits them all, not just the one that was clicked. Using them without knowing that has the possibility to do some very destructive things.

    The other thing is that you don't want search engines following the action.Using a an input wrapper in a form avoids that completely. Though its less of an issue with actions because authentication is usually required to proceed with an action in the first place. Still something to consider.

  5. #5
    Non-Member Kalon's Avatar
    Join Date
    Aug 2010
    Location
    At my computer
    Posts
    2,012
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    hmmm...I've used buttons quite a bit on forms and have had no problems.

    If I have a html table displaying, for example, rows from a db table I will have an edit <button> for each row and a checkbox for each row so I can delete multi rows in one submit. Only the row id's of the checked checkboxes are sent to the php script to delete the selected rows and it works without any problems.

  6. #6
    SitePoint Wizard bronze trophy
    Join Date
    Jul 2006
    Location
    Augusta, Georgia, United States
    Posts
    4,182
    Mentioned
    16 Post(s)
    Tagged
    4 Thread(s)
    I some what misspoke, its an IE6 thing.

    http://www.vancelucas.com/blog/ie6-a...bmit-elements/
    The only code I hate more than my own is everyone else's.


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
  •