javascript - PJAX not working when requesting PHP file - Stack Overflow

admin管理员组

文章数量:1022695

I'm trying to write a site with content loaded into a div at runtime using PJAX. The PHP files that i request with the PJAX all include a header and footer, which only produce content if isset($_SERVER['X-PJAX'])

However, when i use the PJAX to load the PHP file, the entire page refreshes. I would assume it's something wrong with my PJAX code, but loading a plain HTML file works fine.

EDIT: In case it is of help, i'm currently running all this on WAMP Server 2.2 running on localhost. It's what i do all my dev stuff in.

for reference, here's the JS i'm using to load the content, and an example of a php page

JS:

if ( $.support.pjax ) {
    //disable <a> tabs, store value of href so pjax can use it
    $('header a').each(function () {
        $(this)
            .attr('pjax', $(this).attr('href'))
            .removeAttr('href')
            .css('cursor','pointer')
    })

    //link up the pjax
    .live('click', function () {
        var link = $(this)
        $('#content').animate({opacity:0}, {duration:500, plete:function(){
            $.pjax({
                url: link.attr('pjax'),
                container: '#content',
                plete: function() {
                    $('#content').animate({opacity:1}, 500);
                }
            });
        }});
    });
}

PHP:

//header.php
<?php
//If we are loading with pjax, ignore the header
if (!isset($_SERVER['X-PJAX'])) {
?>
<!-- head section, opening body tags, etc -->
<div role="main" id="content">
<?php } ?>

//foo.php
<?php include 'header.php'; ?>
<p>sample content</p>
<?php include 'footer.php'; ?>

//footer.php
<?php
if (!isset($_SERVER['X-PJAX'])) {
?>
</div>
<!-- load scripts, etc-->
<?php } ?>

I'm trying to write a site with content loaded into a div at runtime using PJAX. The PHP files that i request with the PJAX all include a header and footer, which only produce content if isset($_SERVER['X-PJAX'])

However, when i use the PJAX to load the PHP file, the entire page refreshes. I would assume it's something wrong with my PJAX code, but loading a plain HTML file works fine.

EDIT: In case it is of help, i'm currently running all this on WAMP Server 2.2 running on localhost. It's what i do all my dev stuff in.

for reference, here's the JS i'm using to load the content, and an example of a php page

JS:

if ( $.support.pjax ) {
    //disable <a> tabs, store value of href so pjax can use it
    $('header a').each(function () {
        $(this)
            .attr('pjax', $(this).attr('href'))
            .removeAttr('href')
            .css('cursor','pointer')
    })

    //link up the pjax
    .live('click', function () {
        var link = $(this)
        $('#content').animate({opacity:0}, {duration:500, plete:function(){
            $.pjax({
                url: link.attr('pjax'),
                container: '#content',
                plete: function() {
                    $('#content').animate({opacity:1}, 500);
                }
            });
        }});
    });
}

PHP:

//header.php
<?php
//If we are loading with pjax, ignore the header
if (!isset($_SERVER['X-PJAX'])) {
?>
<!-- head section, opening body tags, etc -->
<div role="main" id="content">
<?php } ?>

//foo.php
<?php include 'header.php'; ?>
<p>sample content</p>
<?php include 'footer.php'; ?>

//footer.php
<?php
if (!isset($_SERVER['X-PJAX'])) {
?>
</div>
<!-- load scripts, etc-->
<?php } ?>

• php
• javascript
• pjax

Share Improve this question Follow edited Feb 27, 2012 at 4:00 AClockWorkLemon asked Feb 27, 2012 at 3:21 AClockWorkLemonAClockWorkLemon 1122 silver badges33 bronze badges 7

• Did you check browser's error console for messages? – Cheery Commented Feb 27, 2012 at 3:38
• Yeah, nothing es up at all. – AClockWorkLemon Commented Feb 27, 2012 at 3:40
• I'm getting the feeling that it is something to do with PHP. Almost like the PHP daemon is noticing a request to a PHP file and just spamming the whole file out. But i could be very wrong. – AClockWorkLemon Commented Feb 27, 2012 at 3:59
• Look at the requests made to the server and its answers (almost every browser can show it). PHP should not create this kind of behavior. The best way is to give a link to a page with a problem. – Cheery Commented Feb 27, 2012 at 4:05
• Ok. I officially feel stupid. It would seem to be an issue with my local server setup or something. On uploading it to my webhost to display the issue it works fine. I suppose now the question is working out how to make said local server work properly -_- – AClockWorkLemon Commented Feb 27, 2012 at 5:35

 |  Show 2 more ments

1 Answer 1

Sorted by: Reset to default 6

i always have more luck with just using

 $_SERVER["HTTP_X_PJAX"]

Here is the github repo i made of a fully functional PJAX php example, for those that need all the source code to look at to get up and running, and may help anyone else out there searching for PJAX php inplementation

https://github./Jrizzi1/pjaxphp

I'm trying to write a site with content loaded into a div at runtime using PJAX. The PHP files that i request with the PJAX all include a header and footer, which only produce content if isset($_SERVER['X-PJAX'])

However, when i use the PJAX to load the PHP file, the entire page refreshes. I would assume it's something wrong with my PJAX code, but loading a plain HTML file works fine.

EDIT: In case it is of help, i'm currently running all this on WAMP Server 2.2 running on localhost. It's what i do all my dev stuff in.

for reference, here's the JS i'm using to load the content, and an example of a php page

JS:

if ( $.support.pjax ) {
    //disable <a> tabs, store value of href so pjax can use it
    $('header a').each(function () {
        $(this)
            .attr('pjax', $(this).attr('href'))
            .removeAttr('href')
            .css('cursor','pointer')
    })

    //link up the pjax
    .live('click', function () {
        var link = $(this)
        $('#content').animate({opacity:0}, {duration:500, plete:function(){
            $.pjax({
                url: link.attr('pjax'),
                container: '#content',
                plete: function() {
                    $('#content').animate({opacity:1}, 500);
                }
            });
        }});
    });
}

PHP:

//header.php
<?php
//If we are loading with pjax, ignore the header
if (!isset($_SERVER['X-PJAX'])) {
?>
<!-- head section, opening body tags, etc -->
<div role="main" id="content">
<?php } ?>

//foo.php
<?php include 'header.php'; ?>
<p>sample content</p>
<?php include 'footer.php'; ?>

//footer.php
<?php
if (!isset($_SERVER['X-PJAX'])) {
?>
</div>
<!-- load scripts, etc-->
<?php } ?>

I'm trying to write a site with content loaded into a div at runtime using PJAX. The PHP files that i request with the PJAX all include a header and footer, which only produce content if isset($_SERVER['X-PJAX'])

However, when i use the PJAX to load the PHP file, the entire page refreshes. I would assume it's something wrong with my PJAX code, but loading a plain HTML file works fine.

EDIT: In case it is of help, i'm currently running all this on WAMP Server 2.2 running on localhost. It's what i do all my dev stuff in.

for reference, here's the JS i'm using to load the content, and an example of a php page

JS:

if ( $.support.pjax ) {
    //disable <a> tabs, store value of href so pjax can use it
    $('header a').each(function () {
        $(this)
            .attr('pjax', $(this).attr('href'))
            .removeAttr('href')
            .css('cursor','pointer')
    })

    //link up the pjax
    .live('click', function () {
        var link = $(this)
        $('#content').animate({opacity:0}, {duration:500, plete:function(){
            $.pjax({
                url: link.attr('pjax'),
                container: '#content',
                plete: function() {
                    $('#content').animate({opacity:1}, 500);
                }
            });
        }});
    });
}

PHP:

//header.php
<?php
//If we are loading with pjax, ignore the header
if (!isset($_SERVER['X-PJAX'])) {
?>
<!-- head section, opening body tags, etc -->
<div role="main" id="content">
<?php } ?>

//foo.php
<?php include 'header.php'; ?>
<p>sample content</p>
<?php include 'footer.php'; ?>

//footer.php
<?php
if (!isset($_SERVER['X-PJAX'])) {
?>
</div>
<!-- load scripts, etc-->
<?php } ?>

• php
• javascript
• pjax

Share Improve this question Follow edited Feb 27, 2012 at 4:00 AClockWorkLemon asked Feb 27, 2012 at 3:21 AClockWorkLemonAClockWorkLemon 1122 silver badges33 bronze badges 7

• Did you check browser's error console for messages? – Cheery Commented Feb 27, 2012 at 3:38
• Yeah, nothing es up at all. – AClockWorkLemon Commented Feb 27, 2012 at 3:40
• I'm getting the feeling that it is something to do with PHP. Almost like the PHP daemon is noticing a request to a PHP file and just spamming the whole file out. But i could be very wrong. – AClockWorkLemon Commented Feb 27, 2012 at 3:59
• Look at the requests made to the server and its answers (almost every browser can show it). PHP should not create this kind of behavior. The best way is to give a link to a page with a problem. – Cheery Commented Feb 27, 2012 at 4:05
• Ok. I officially feel stupid. It would seem to be an issue with my local server setup or something. On uploading it to my webhost to display the issue it works fine. I suppose now the question is working out how to make said local server work properly -_- – AClockWorkLemon Commented Feb 27, 2012 at 5:35

 |  Show 2 more ments

1 Answer 1

Sorted by: Reset to default 6

i always have more luck with just using

 $_SERVER["HTTP_X_PJAX"]

Here is the github repo i made of a fully functional PJAX php example, for those that need all the source code to look at to get up and running, and may help anyone else out there searching for PJAX php inplementation

https://github./Jrizzi1/pjaxphp

本文标签： javascriptPJAX not working when requesting PHP fileStack Overflow