I'm a newbie to jquery-pjax. Now, I'm developing a flexible(no refresh and load content asynchronously) single web page using PHP and jQuery. But some issues occur in my page when using jquery-pjax. One of the issues is that jquery-pjax will strip an outermost tag automatically in asynchronous responses.
Let me see my source code.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="jquery.min.js"></script>
<script src="jquery.pjax.min.js"></script>
<script>
$(document).pjax('#pjax-container a', '#pjax-container', {
timeout: 1300,
replace: true,
fragment: 'body'
});
</script>
</head>
<body>
<?php
if (!isset($_SERVER['HTTP_X_PJAX']))
{
?>
<h1>A jquery-pjax test page.</h1>
<div id="pjax-container">
<?php
}
?>
<a href=".">Refresh</a>
<?php
if (!isset($_SERVER['HTTP_X_PJAX']))
{
?>
</div>
<?php
}
?>
</body>
</html>
In terms only the source code, It seems that there isn't any issue. But when run it and click the refresh link, the link be removed and there is only its caption. I saw a network monitor in my browser, There is the link in the new asynchronous response. (body : <body><a href=".">Refresh</a></body>
) But I saw a elements monitor, There isn't the link... (body : <div id="pjax-container">Refresh</div>
)
Question : Why jquery-pjax does strip an outhermost tag?
Thanks.