CODEWITHSUNDEEP
javascriptphpajax
brown.cn
brown.cn

Reputation: 151

Do a javascript redirect after an ajax call

I'm trying to use ajax to parse data to be processed on a php page and have php echo a javascript redirect to another page but it is not working. I have read that js does not work after running an ajax call so I will like to know if there s a way around it. This is my code:

html

<form>
    <div class="depart_time bottom_white w-40 ml-auto">
            <p>Time</p>
            <input type="time" name = "return_time" id = "rt">
    </div>
    <div class = "search_button r_search">
        <button id = "r_search" onclick = "return false" onmousedown = "rent()">SEARCH</button>
    </div>

</form>

ajax call is a normal xhttp request that gets sent to php for processing after which a redirection should occur:

if(isset($_POST['return_time'])){
    echo '<script type="text/javascript">window.location.href="link.html"</script>';
}

Please an help is appreciated. I'm new to using ajax.

EDIT the ajax code:

gid("r_search").addEventListener("mousedown", rent);
    function rent(){
        rt = gid('rt').value;
        r_search = gid('r_search').value;

        form_array = '&rt=' + rt +
        '&r_search=' + r_search;

        send_data = form_array;

        ajax_data('app/rent.php', 'error', send_data);
        //gid('error').innerHTML = send_data;
    }


function ajax_data(php_file, getId, send_data){
        gid(getId).innerHTML = "loading";
        var xhttpReq = new XMLHttpRequest();
        xhttpReq.open("POST", php_file, true);
        xhttpReq.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        xhttpReq.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
                gid(getId).innerHTML = xhttpReq.responseText;
            }
        };
        xhttpReq.send(send_data);
    }

please note that 'gid' is for getelementbyid

Upvotes: 0

Views: 91

Answers (1)

Vantiya
Vantiya

Reputation: 627

You have to make bit alteration to your way of redirection.

First you need to make changes in your PHP response

if(isset($_POST['return_time'])){
    ...

    // If you get your process success return 1
    if(success) { 
        echo 1; die(); 
    } else {
        // else set some flag that you could get on your AJAX response
        echo 0; die();
    }
}

Now, get this flag on your AJAX and make changes to your below functions:

function ajax_data(php_file, getId, send_data){
        gid(getId).innerHTML = "loading";
        var xhttpReq = new XMLHttpRequest();
        xhttpReq.open("POST", php_file, true);
        xhttpReq.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        xhttpReq.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
                if( xhttpReq.responseText == 1 ) window.location.href="URL where you wish to redirect page";
            }
        };
        xhttpReq.send(send_data);
    }

I've written this answer for others who come here for help.

Upvotes: 2

Related Questions