Jquery Pjax Example - Jquery
What is pjax request in jquery?
Snippet Code
Rate this page :
|
[ 0 votes]
|
Pjax is a technique which generally allows you to enhance normal links on a webpage. In pjax, code in the server can be reused. Pjax request will be passed like otherrequests through stack, except the browser removes some content on the webpage instead of creating a new webpage. So you do not need to duplicate the server sidetemplate on the client side.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript" src="http://pjax.herokuapp.com/jquery.pjax.js"></script>
<script>
$(document).ready(function(){
$('a[data-pjax]').pjax(undefined, {
error: function(jqXHR, textStatus, errorThrown) {
alert("Could not use pjax!" + jqXHR + " " + textStatus + " " + errorThrown);
}
});
$('body').bind('pjax:start', function(xhr, options) {
$(options.container).fadeOut("fast", function() {
alert("Faded out");
});
}).bind('pjax:end', function(xhr, options) {
$(options.container).fadeIn("fast");
});
});
</script>
<div id="valtozo">
This will be replaced.
</div>
<a href="news.html" data-pjax="#valtozo">Show Html Page</a>
news.html:
--------------
<html>
<head><title>Demo Pjax</title></head>
<body>
Welcome!!
</body>
</html>
