Multiple PJAX Requests

Question

I am trying to update 2 separate divs with PJAX. My PJAX is not working and only the second one is loading. Here is an example:

<div id="content-1"></div> <div id="content-2"></div> <button onclick=" $.pjax({ url: 'content-1.php', container: '#content-1', push: false }); $.pjax({ url: 'content-2.php', container: '#content-2', push: false }); "></button> 

The problem is that two pjax requests cannot be executed at the same time, and the second one overlaps the first one, therefore only the second one is updated (one with id = "content-2"). Push is set to false by default, I don’t need the URL that I need to click in this particular case, but I need this for other parts of the site.

Answer 1

If the URL does not need to be changed, use AJAX instead of PJAX. PJAX and AJAX do the same thing - they only refresh a certain portion of the HTML content without reloading the entire page. However, PJAX changes the URL in the address bar, so it should only be used in a specific way.

A good example of using PJAX and AJAX is the simple gallery. If the page needs to be modified, it is best to use PJAX so that it can change the URL in the address bar by adding the GET parameter for the page. But it is more advisable to use AJAX to get additional information for a clicked image in a popup window.