SitePoint Sponsor

User Tag List

Results 1 to 14 of 14
  1. #1
    SitePoint Guru phantom007's Avatar
    Join Date
    May 2008
    Posts
    737
    Mentioned
    3 Post(s)
    Tagged
    0 Thread(s)

    Question jQuery - Redirecting a Page

    Hi

    I am using PHP and jQuery to validate a login. If the user enters wrong user/pass, an error message will be shown on the index.php page, under a <DIV></DIV> tag. This works fine...

    But, how do I make an index.php page redirect to welcome.php once the user enters the correct login information? Since everything is handled by jQuery, hence using the header("location: welcome.php") function will not work as the page is NOT refreshing.


    Please help.


    Thanx

  2. #2
    SitePoint Wizard gRoberts's Avatar
    Join Date
    Oct 2004
    Location
    Birtley, UK
    Posts
    2,439
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    When you get a valid login, use

    Code javascript:
    window.location = 'welcome.php';


  3. #3
    SitePoint Guru phantom007's Avatar
    Join Date
    May 2008
    Posts
    737
    Mentioned
    3 Post(s)
    Tagged
    0 Thread(s)
    How would jQuery know that the login is correct since the authentication process is handled by PHP?

  4. #4
    SitePoint Wizard gRoberts's Avatar
    Join Date
    Oct 2004
    Location
    Birtley, UK
    Posts
    2,439
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    but the php has to react depending on whether the login was correct or not. If its incorrect its reacting a certain way in which you are able to show an error message.

    If its correct, you should be able to react by redirecting.

    Maybe if you could show us some code, we could point you in the right direction.


  5. #5
    Function Curry'er JimmyP's Avatar
    Join Date
    Aug 2007
    Location
    Brighton, UK
    Posts
    2,006
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Um, you said that you cannot use php's header('location.... etc... Why not??
    James Padolsey
    末末末末末末末末末末末末末末末末末末末
    Awesome JavaScript Zoomer (demo here)
    'Ajaxy' - Ajax integration solution (demo here)

  6. #6
    SitePoint Wizard gRoberts's Avatar
    Join Date
    Oct 2004
    Location
    Birtley, UK
    Posts
    2,439
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Correct me if i'm wrong but the server side code CANNOT redirect the client browser page using header redirects when using ajax. It will simply redirect the ajax call to that url.


  7. #7
    Function Curry'er JimmyP's Avatar
    Join Date
    Aug 2007
    Location
    Brighton, UK
    Posts
    2,006
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Sorry, I think I misunderstood what the OP was saying.

    @Cancer10 - Gavin's original code should work. The PHP must feed back to the client side somehow - the response within the DIV obviously originates from the server side. You could, dependent on the eventual contents of that div, redirect the user appropriately.
    James Padolsey
    末末末末末末末末末末末末末末末末末末末
    Awesome JavaScript Zoomer (demo here)
    'Ajaxy' - Ajax integration solution (demo here)

  8. #8
    SitePoint Wizard gRoberts's Avatar
    Join Date
    Oct 2004
    Location
    Birtley, UK
    Posts
    2,439
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Jimmy my last post was not directed at you, I think the OP misunderstood how ajax works.

    Basically jquery receives a response from the server. You could, if i recall pass back javascript and it will eval it... Unless we see how your doing it now, we can't really help.


  9. #9
    Function Curry'er JimmyP's Avatar
    Join Date
    Aug 2007
    Location
    Brighton, UK
    Posts
    2,006
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yep I agree! ..

    Let's see some code!
    James Padolsey
    末末末末末末末末末末末末末末末末末末末
    Awesome JavaScript Zoomer (demo here)
    'Ajaxy' - Ajax integration solution (demo here)

  10. #10
    SitePoint Wizard REMIYA's Avatar
    Join Date
    May 2005
    Posts
    1,351
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    If you redirect from within PHP use the PHP header function to redirect.

    Once displayed on the page use the meta refresh tag or the JavaScript redirect. Using both is the best practice, for some browsers are not JS enabled.

  11. #11
    SitePoint Wizard gRoberts's Avatar
    Join Date
    Oct 2004
    Location
    Birtley, UK
    Posts
    2,439
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    But if you do a redirect within an ajax call it will not redirect the browser to that url, it will redirect the ajax call to that url. The ajax call will not return the response from the original url but the response of the redirected url.


  12. #12
    SitePoint Wizard REMIYA's Avatar
    Join Date
    May 2005
    Posts
    1,351
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by gRoberts View Post
    But if you do a redirect within an ajax call it will not redirect the browser to that url, it will redirect the ajax call to that url. The ajax call will not return the response from the original url but the response of the redirected url.
    If you use Ajax you have two options:

    1. Submit back a JavaScript that will redirect
    2. Submit back a successful login, and then redirect to the new URL from the existing code.

    Both work fine.

  13. #13
    SitePoint Guru whisher's Avatar
    Join Date
    May 2006
    Location
    Kakiland
    Posts
    732
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by cancer10 View Post
    Hi

    I am using PHP and jQuery to validate a login. If the user enters wrong user/pass, an error message will be shown on the index.php page, under a <DIV></DIV> tag. This works fine...

    But, how do I make an index.php page redirect to welcome.php once the user enters the correct login information? Since everything is handled by jQuery, hence using the header("location: welcome.php") function will not work as the page is NOT refreshing.


    Please help.


    Thanx
    Hi.
    For teaching purpose only:

    PHP Code:
    function onError(xhrster) {
            
    alert('Server busy');       
    };
    function 
    onSuccess(json) {
            var 
    loginparseInt(json.login,10);
            if(
    isNaN(login)){
                
    // no login
                
    alert('no login');
            }
            else if(
    login==1){
                
    alert('good login');
                
    window.location 'welcome.php';
            }
            else{
                
    alert('no login');
            }
    };
    $(
    document).ready(function(){
         $.
    ajax( { 
            
    url'login.php',  
            
    type 'POST'
            
    success onSuccess
            
    data : {username 'theusername'password 'thepassword'}, 
            
    dataType 'json',
            
    error onError 
        
    } );
    }); 
    login.php

    PHP Code:
    <?php 
    $username
    'theusername';
    $password'thepassword';
    if(isset(
    $_POST['username']) && isset($_POST['password'])){
    //You must check input data
        
    if($_POST['username']==$username && $_POST['password']==$password){
            echo 
    json_encode(array('login'=>1));
        }
        else{
            echo 
    json_encode(array('login'=>null));
        }
    }
    ?>
    If you use ajax you can't manage redirect server-side.
    You can add server-side a thing like this:
    PHP Code:
    function isXhr(){
        return (isset(
    $_SERVER['HTTP_X_REQUESTED_WITH']) && $_SERVER['HTTP_X_REQUESTED_WITH']=='XMLHttpRequest');
    }
    if(
    isXhr()){
        
    //you are using ajax with jquery
    }
    else{
        
    //server side

    I hope this help.

    Bye.

  14. #14
    SitePoint Wizard REMIYA's Avatar
    Join Date
    May 2005
    Posts
    1,351
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Nice example.


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
  •