Thursday, May 24, 2012

How can I make a redirect page in jQuery/JavaScript?


How can I redirect the user from one page to another using jQuery?



Source: Tips4all

8 comments:

  1. jQuery is not necessary, and window.location.replace(...) will best simulate an HTTP redirect.

    It is better than using window.location.href =, because replace() does not put the originating page in the session history, meaning the user won't get stuck in a never-ending back-button fiasco. If you want to simulate someone clicking on a link, use location.href. If you want to simulate an HTTP redirect, use location.replace.

    For example:

    // similar behavior as an HTTP redirect
    window.location.replace("http://stackoverflow.com");

    // similar behavior as clicking on a link
    window.location.href = "http://stackoverflow.com";

    ReplyDelete
  2. You don't need jQuery to do just that:

    window.location = "http://www.page-2.com";

    ReplyDelete
  3. It would help if you were a little more descriptive in what you are trying to do. If you are trying to generate paged data, there are some options in how you do this. You can generate separate links for each page that you want to be able to get directly to.

    <a href='/path-to-page?page=1' class='pager-link'>1</a>
    <a href='/path-to-page?page=2' class='pager-link'>2</a>
    <span class='pager-link current-page'>3</a>
    ...


    Note that the current page in the example is handled differently in the code and with CSS.

    If you want the paged data to be changed via AJAX, this is where jQuery would come in. What you would do is add a click handler to each of the anchor tags corresponding to a different page. This click handler would invoke some jQuery code that goes and fetches the next page via AJAX and updates the table with the new data. The example below assumes that you have a web service that returns the new page data.

    $(document).ready( function() {
    $('a.pager-link').click( function() {
    var page = $(this).attr('href').split(/\?/)[1];
    $.ajax({
    type: 'POST',
    url: '/path-to-service',
    data: page,
    success: function(content) {
    $('#myTable').html(content); // replace
    }
    });
    return false; // to stop link
    });
    });

    ReplyDelete
  4. This works for every browser:

    window.location.href = 'your_url';


    Good luck!

    ReplyDelete
  5. $jq(window).attr("location","http://google.fr");


    This version works well with jQuery 1.6.2.

    ReplyDelete
  6. var url = 'asdf.html';
    window.location.href = url;

    ReplyDelete
  7. You can do that without jQuery as:

    window.location = "http://yourdomain.com";


    And if you want only jQuery then you can do it like :

    $jq(window).attr("location","http://yourdomain.com");

    ReplyDelete
  8. I think it is elegant to build a form with GET method and then submit it, and it will work in every browser and every version.

    < form id="getter" method="GET" action="URL" >
    < input type="hidden" name="variable" value="value" />
    < /form >


    and you go:

    $( '#getter' ).submit();

    ReplyDelete