{"id":28515966,"url":"https://github.com/thybag/pjax-standalone","last_synced_at":"2025-07-05T17:30:50.425Z","repository":{"id":2689843,"uuid":"3682758","full_name":"thybag/PJAX-Standalone","owner":"thybag","description":"A standalone implementation of Pushstate AJAX, for non-jquery webpages.","archived":false,"fork":false,"pushed_at":"2015-06-04T11:14:46.000Z","size":527,"stargazers_count":203,"open_issues_count":17,"forks_count":42,"subscribers_count":8,"default_branch":"master","last_synced_at":"2025-06-09T03:37:28.957Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":"ari/jobsworth","license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/thybag.png","metadata":{"files":{"readme":"readme.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2012-03-10T22:02:36.000Z","updated_at":"2025-03-17T13:56:01.000Z","dependencies_parsed_at":"2022-09-03T06:22:26.552Z","dependency_job_id":null,"html_url":"https://github.com/thybag/PJAX-Standalone","commit_stats":null,"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"purl":"pkg:github/thybag/PJAX-Standalone","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thybag%2FPJAX-Standalone","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thybag%2FPJAX-Standalone/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thybag%2FPJAX-Standalone/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thybag%2FPJAX-Standalone/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/thybag","download_url":"https://codeload.github.com/thybag/PJAX-Standalone/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thybag%2FPJAX-Standalone/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":263778284,"owners_count":23509967,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2025-06-09T03:31:29.917Z","updated_at":"2025-07-05T17:30:50.413Z","avatar_url":"https://github.com/thybag.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# PJAX-Standalone#\n\nA standalone implementation of push state AJAX, designed for use on non-JQuery web pages.\nThe design is loosely based on the original jQuery implementation found at: https://github.com/defunkt/jquery-pjax\n\nThis code is licensed under the MIT License.\n\nThis code has been tested in Chrome, Firefox, Opera and IE7, 8, 9 and 10. \nPJAX is supported in Chrome, Firefox, IE10+ and Opera, while in older IE versions the fall backs operate as expected.\n\nA live version of the demo can be viewed here: http://userbag.co.uk/demo/pjax/\n\n### Usage Instructions\n\nTo use PJAX on your page you will need to include the pjax-standalone.js script in to the head of the page. Alternately, if the assets for your site are built (using a tool like grunt) PJAX standalone can also be installed using bower `bower install pjax-standalone`.\n\nOnce done, PJAX can be setup in 3 ways. \n\n#### Option 1\nGive all links a data-pjax attribute specifying where to place the content that gets loaded:\n\n    \u003ca href='page1.php' data-pjax='content'\u003ePage 1\u003c/a\u003e\n\nThen call:\n\n\tpjax.connect();\n\n#### Option 2\nAdd links normally\n\n\t\u003ca href='page2.php'\u003ePage 2\u003c/a\u003e\n\t\nThen specify which container they should use, via either\n\n\tpjax.connect('content');\n\nor\n\n\tpjax.connect({container: 'content'});\n\n#### Option 3\nSet all links with a specific class to use a particular container using:\n\n```\n\t\u003ca href='page2.php' class='pjaxer'\u003ePage 2\u003c/a\u003e\n```\n\n```\n\tpjax.connect('content', 'pjaxer');\n```\t\n### Options\n\nThe PJAX connect method supports the following options:\n\n* useClass - string - Apply PJAX only to links with the provided class.\n* excludeClass - string - If set, PJAX will ignore any link containing the class\n* parseLinksOnload - true|false - Make links in loaded pages use PJAX. Enabled by default.\n* smartLoad - true|false - Ensure returned HTML is correct. Enabled by default.\n* autoAnalytics - true|false - Enabled by default, will attempt to automatically track page views to any detected Google analytics trackers.\n* returnToTop - true|false - Enabled by default, scrolls browser window to top of page, when new content is loaded.\n* parseJS - true|false - Disabled by default, attempt to execute JavaScript found within pages load via PJAX. (plain JS will be run each time the page loads, external files will only be loaded the first time.)\n* ignoreFileTypes - array of file types to be ignored by PJAX. By default this includes PDF, ZIP and a number of other common non-pjax loadable types.\n\n### Callbacks\n\nPJAX-Standalone implements the following callbacks/events:\n\n* beforeSend - Called before AJAX request is made\n* complete - When AJAX request has completed\n* success - When AJAX request has completed successfully\n* error - When AJAX request did not complete successfully (error 404/500 etc)\n* ready - Fired when PJAX completes initial link parsing\n\nThe callbacks can be specified either as part of the original pjax.connect method:\n\n\tpjax.connect({\n\t\t'container': 'content',\n\t\t'beforeSend': function(e){ console.log(\"before send\"); },\n\t\t'complete': function(e){ console.log(\"done!\"); },\n\t});\n\nOr by adding your own listener to the specified container\n\n\tdocument.getElementById(\"my_container\").addEventListener('complete', function(event){ console.log(event); }, false);\n\nThe PJAX options at the time of an event being triggered can be accessed via `event.data`\n\n### Using PJAX-Standalone programmatically\n\nYou can invoke a PJAX page load programmatically by calling the `pjax.invoke()` method.\nAt minimum the PJAX invoke method must be given a `URL` and `container` attribute. It can also\nbe provided with a `title`, along with any other standard config item or callback you may wish.\n\n\tpjax.invoke({url:'page1.php', 'container': 'content'});\n\nor\n\t\n\tpjax.invoke('page1.php', 'content');\n\n### Server side.\n\nUpdate your code to return only the main content area when the X-PJAX header is set, while returning the full website layout when it is not.\n\t\n\t\u003c?php\n\tif(isset($_SERVER['HTTP_X_PJAX']) \u0026\u0026 $_SERVER['HTTP_X_PJAX'] == 'true'){\n\t\t// Output content on its own.\n\t}else{\n\t\t// Output content with wrapper/layout\n\t}\n\nIf you are unable to change the server side code or simply do not want to, So long as smartLoad is enabled (which it is by default), PJAX-Standalone will extract the container_divs content from the returned HTML and apply it to the current page meaning PJAX loading will still work as expect (although some of PJAX's performance gains may be lost).\n\n\n\t\n\t\n\t\n\n\n      \n\n\t\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthybag%2Fpjax-standalone","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fthybag%2Fpjax-standalone","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthybag%2Fpjax-standalone/lists"}