SitePoint Sponsor

User Tag List

Results 1 to 13 of 13
  1. #1
    SitePoint Enthusiast Jumping Bean's Avatar
    Join Date
    Oct 2007
    Location
    In the air
    Posts
    79
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    How to create an accessible back button?

    Hi,

    I'm looking for a way of creating an accessible back button. I know the browser has got one already but I still want/need to create one. The options I've encountered so far are as follows:

    <a href="javascript:history.go(-1)">go back</a>

    <A HREF="javascript:history.back()">Go back</A>

    <input type=button value="Back" onClick="history.go(-1)">

    <A HREF="bestguess.html" onClick="history.back();return false;">Go back</A>

    I think the last one sends javascript enabled browsers back to the previous page but also provides a "best guess" URL for non-javascript browsers? Is that right? If so that sounds quite attractive as 75&#37; of the time my best guess will be right anyway.

    Has anyone got any input on this?

    Thanks.

  2. #2
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,495
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Why do you want/need one?

  3. #3
    SitePoint Enthusiast Jumping Bean's Avatar
    Join Date
    Oct 2007
    Location
    In the air
    Posts
    79
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I want to provide a nice convenient way for users to go back to the previous page. I know they can use the browser's back button but sometimes they don't. And maybe more importantly I've been told to create one. From my point of view it just adds another route back and as I understand it there is nothing wrong with them apart from the fact they're hard to create in a non-javascript friendly fashion. Is there a way to do this in an accessible way?

  4. #4
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,495
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It's going to depend on the type of page being created. If it's a multi-page article, then I'd go with just putting a link to the previous page in there. The only other thing I can think of would be to store a session-based cookie and then use that along with some PHP to track which link was clicked on and generate a link back to that page on the server side, but I don't even know if that's possible.

  5. #5
    SitePoint Member
    Join Date
    Feb 2008
    Location
    Scotland, UK
    Posts
    12
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    What do you mean by wanting to send people 'back to the previous page'? Do you mean that literally, so that if they have arrived there via Google you want to take them back to Google? As Dan says, if it is more the case of giving them navigational aids to the previous page of a series of pages, a standard link would be much more appropriate.

  6. #6
    om nom nom nom Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,234
    Mentioned
    47 Post(s)
    Tagged
    1 Thread(s)
    Heh, I'm trying to talk my colleague OUT of a Javascript back-button.

    The page this is used for is when someone's filled out everything on the form, but didn't hit "Akkord" at the Terms&Conditions box... usually 99% of the time a mistake on the client's part. If they leave it at the default "Niet Akkord" then they end up at a page saying they didn't agree, and a back button. I would think that even in a session-logged event, the normal browser Back Button should be okay.

    But then I dunno about the whole POST-DATA thing where everything they've filled out is blanked...

  7. #7
    SitePoint Wizard bronze trophy C. Ankerstjerne's Avatar
    Join Date
    Jan 2004
    Location
    The Kingdom of Denmark
    Posts
    2,692
    Mentioned
    7 Post(s)
    Tagged
    0 Thread(s)
    I would use a checkbox for agreeing to the conditions in stead. You can use Javascript to set the button as DISABLED, and then enable it on ONCHANGE on the checkbox. For users who doesn't have Javascript, you can return the user to the filled out form using the POST data, with a highlighted message at the top stating they forgot to agree to the conditions.

    This is standard behaviour (give or take), by the way, so I think your users would appreciate it more. It will probably also be easier to set up.
    Christian Ankerstjerne
    <p<strong<abbr/HTML/ 4 teh win</>
    <>In Soviet Russia, website codes you!

  8. #8
    om nom nom nom Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,234
    Mentioned
    47 Post(s)
    Tagged
    1 Thread(s)
    Right now it's a textarea with the legal stuff, and a radio button (a checkbox means someone somewhere will check both "agreed" and "not agreed").

    For users who doesn't have Javascript, you can return the user to the filled out form using the POST data, with a highlighted message at the top stating they forgot to agree to the conditions.
    This however is more what I want... I want all of of the form to work without JS (the rest is back-end Perl)... and I sorta follows what I've got for other errors on earlier forms so I think this is the better choice. : )

  9. #9
    SitePoint Wizard bronze trophy C. Ankerstjerne's Avatar
    Join Date
    Jan 2004
    Location
    The Kingdom of Denmark
    Posts
    2,692
    Mentioned
    7 Post(s)
    Tagged
    0 Thread(s)
    You only need one checkbox, i.e. 'I agree'. This also follows the standard convention for agreements, in that unless the user explicitly agrees, he implicitly disagrees.
    Christian Ankerstjerne
    <p<strong<abbr/HTML/ 4 teh win</>
    <>In Soviet Russia, website codes you!

  10. #10
    SitePoint Wizard
    Join Date
    Oct 2005
    Location
    London
    Posts
    1,678
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I haven't really read all the replies to this post, nor do i understand why you want to do this particularly but you could achieve this server side....in php to find the address of the previous page it's just:

    PHP Code:
    $_SERVER['HTTP_REFERER']; 
    you could echo this out in the href of your back button and hey presto


  11. #11
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,159
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You can't trust the Referer HTTP header. It's frequently blocked by proxies and firewalls, some browsers allow blocking it, and it can be spoofed.
    Birnam wood is come to Dunsinane

  12. #12
    SitePoint Member
    Join Date
    Mar 2008
    Posts
    23
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well if we are going to do it we may as well do it as a Jazajay way and no guessing involved.

    PHP I would do it like this, I've only tought myself PHP not ASP so if you need that or another language maybe you can backwards engineer it after you see the code.

    Change the form to submit to it's self.

    PHP Code:

    <form action="thispage.php" method="post">
    <p>
    <input type="text" name="hello" <?php if(isset($_SESSION['name'])){echo"value=\"".$_SESSION['name']."\"";$_SESSION['name']=""}?> />
    <input type="submit" value="send" />
    </p>
    </form>
    Then above the doctype for that page create this.
    PHP Code:
    <?php
    session_start
    ();
    if(isset(
    $_POST['hello']) && !empty($_POST['hello']))
    {
    $_SESSION['name']=$_POST['hello'];
    $_SESSION['page']="the-path-to-this-page-made-url-freindly.php";
    header("Location: your other page you want the back button on.php");
    }
    ?>
    Then on the page with the button on create this
    PHP Code:
    <?php
    if(isset($_SESSION['name']))
    {
    ?>
    <a href="<?php echo $_SESSION['page']?>"><img src="../images/back.png" alt="problem with query please go back" /></a>
    <?php }?>
    Ok in case you don't know php and use a different language. Lets go through it.

    1. You start off by getting the form to submit to the same page it's on.
    If it is submitted the if block above the doctype will execute if it hasn't it wont and will load the form.

    2. If the form has been submitted you place the form contents into a session, this could be an array, and the page name for this form in it's URL form.

    You could create a function if it is a dynamic page, or if you ask nicely I might do it.

    3. You test to see if the session is set. If it is you display the sesssion and the link back to the page with the form.

    If it's set the form has been submitted, if it hasn't the page was loaded directly so the button would equal nothing so don't display it.

    4. Then if they click the button they go back to the previous page and the form is populated using the data in the session. The session is then set to empty.

    1 accessable form done the Jazajay way.

    Remember to start the session with session_start(); on the top of the page you want the button on.
    Jaza
    Last edited by jazajay; Mar 16, 2008 at 22:55. Reason: Odd word here and there

  13. #13
    SitePoint Member
    Join Date
    Mar 2008
    Posts
    23
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Just as a side point.
    Wouldn't it be quicker just to re-show the form on that page so they don't have to click back.

    For example -

    Are you sure this information is correct?
    heres the form to change your mistake you idiot.

    You could hide the form on the page and show via JavaScript if they clicked the back button.
    Thus saving them a page load. I would do that it's a lot quicker and then you populate the form with data from the post array.

    He he now you have two ways to accomplish this.

    I know, I know I'm great.
    And quite usefull at times, regardless of what my other half says, apparently.

    Jaza
    Last edited by jazajay; Mar 16, 2008 at 22:57. Reason: Odd word here and there


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
  •