I'm using jquery pace plugin with progress bar theme, all is working good. but i want to fix this run only on ajax request. After lots of searching i'm deciding to post there. Hope someone having the solution. Currently its running on both Ajax and page load.

Here's the js file call with options given by plugin. but no luck.

<script data-pace-options='{ "document": false }' src="js/pace/pace.min.js"></script>

I'm using jquery pace plugin with progress bar theme, all is working good. but i want to fix this run only on ajax request. After lots of searching i'm deciding to post there. Hope someone having the solution. Currently its running on both Ajax and page load.

Here's the js file call with options given by plugin. but no luck.

<script data-pace-options='{ "document": false }' src="js/pace/pace.min.js"></script>

• javascript
• jquery
• ajax

• have you tried loading the pace script on ajax instead of hardcoding it into the page? you can attach the script dynamically and remove it from the header... – Banana Commented Sep 26, 2014 at 10:07

2 Answers 2

I found the answer to stop pace.js on page load and here I'm posting this for other users.

Here's the code of js calling.

<script data-pace-options='{ "elements": { "selectors": [".selector"] }, "startOnPageLoad": false }' src="js/pace/pace.min.js"></script>

In this i'm setting pace to given selector and another option startOnPageLoad set to false to avoid loading pace on every page load.

And here is the another question on pace.js which provide me a help.

Using pace.js on loading appended images

If you do not want a script to run on page load, i can think of 2 options at the moment:

1) open pace.min.js file and find the code that makes it run at start, and simply alter it into a function that you can call on your ajax call.

2) remove the pace.min.js link from header, and only attach it on your ajax request/response.

• Here you can find an explanation on how to attach external code using javascript, for you it will be something like this:

  var fileref=document.createElement('script');
  fileref.setAttribute("data-pace-options","{ 'document': false }");
  fileref.setAttribute("src", "js/pace/pace.min.js");
  document.getElementsByTagName("head")[0].appendChild(fileref);