chickendipper

Hello,

Sorry to bother you again. I have come across an issue that happens when using the code to prevent page reloads when using the search.
What happens is after navigating the site and hitting the back button, the previous page will load but seems to reload a few times. The more you navigate around the site and go back the worse this gets and you end up watching the page load endlessley.

Just wondered if you know why this happens when using the code or if I can stop it?
I have contacted the theme dev too just in case.

The complete code is:

	let dom_observer = new MutationObserver(function(mutation) {
		if ( typeof Pjax != 'undefined' ) {
			let newContent = document.querySelector(".asl_r");
			let pjax = new Pjax({
				       cacheBust: false,
					   elements: "a", // default is "a[href], form[action]"
					   selectors: ["title", "#header nav", "#aside", "#footer", "#content"] 
					});
			pjax.refresh(newContent);
			jQuery('.asl_r .item').off('click.body').one('click.body', function(){
				document.body.click();
			});
		}
	});
	let	container = document.documentElement || document.body,
		config = { attributes: false, childList: true, subtree: true, characterData: false };
	dom_observer.observe(container, config);

Thanks for any advice you can provide.

Hi,

I have tried everything in the spa guide before posting with no luck with showing the actual pages viewed.

To add I did try using the normal tracking code before switching to tag manager. I only tried tag manager as I thought it may work using history change for example.

My js knowledge isn’t great. Would it be a complex task to create a js variable to use it for the url in the tag?
Not sure I fully understand this.

Thank you.

• This reply was modified 2 years, 9 months ago by chickendipper.

Not a problem.

That is it! It works perfectly.
Thank you very much for all of your help it is very much appreciated ??

Hello,

Sorry I am not sure if I am missing something but there is no line:

pjax.loadUrl(a.getAttribute('href'));

that I can add this after:
document.body.click();

Is this line:
pjax.loadUrl(a.getAttribute('href'));

supposed to be in the code that you provided me?

Edit: I see that you are referring to the very fist code snippet that you provided, but I am not using that code. But I will try to modify the second code to contain these lines and hope I do it correctly ??

Thanks.

• This reply was modified 2 years, 9 months ago by chickendipper.

Update: I have managed to remove the errors I was seeing in the console by moving the js code you provided to load after the search plugin.

Now I just need to make the search box close after clicking on a result and it will work perfectly ??

I did try that, but it made the ajax page loads no longer work. I tried all the selectors I could find but haven’t had any luck yet.

You can see this set as body at the moment on my website I have just changed it as been messing with the search all day to see what I can achieve ??

Sorry for being persistent I really would like to use your search plugin, it is the best one.

One other thing – I don’t suppose you know how I can remove the error from the chrome dev console: Uncaught ReferenceError: Pjax is not defined at MutationObserver.<anonymous>

I did try to define Pjax as a function which reduced the error to lots of the above, to now just one error:
Uncaught SyntaxError: Unexpected identifier

I am willing to pay for your time if you would be interested to fix the issue?

Edit: I found the selectors that the theme uses in the file that runs the pjax code and have added these [“title”, “#header nav”, “#content”, “#aside”, “#footer”]

I can also remove ajax from certain selectors if this would help with the issue within the same file.
Which means my menu selectors are now working, not sure if this helps with the issue at all?

Thank a lot.

• This reply was modified 2 years, 9 months ago by chickendipper.
• This reply was modified 2 years, 9 months ago by chickendipper. Reason: Tidy up code
• This reply was modified 2 years, 9 months ago by chickendipper.

Hello again,

I just wanted to update you, I contacted the developer of my theme and now have removed the random URL string by adding the following line to your code:

cacheBust: false,

So this is great, still unable to get the box to vanish when clicking a result. But the odd thing is Ivory search plugin works fine when using your code. The box will vanish when clicking a result.

Just wondered if you had any other ideas to get to fix the box vanish?

Thanks a lot for the help you provided.

As requested: https://www.ads-software.com/support/topic/please-change-pwa-colour-codes-to-hex

I found something relating to the URL addition, this might shed some light.
In Chrome console:

Uncaught ReferenceError: Pjax is not defined
at MutationObserver.<anonymous> (?t=1652434722411:1565:14)
(anonymous) @ ?t=1652434722411:1565

Sorry my jquery is bad ??

Hi,

The box remains open for some reason, I tried changing the selector but no luck. I will keep playing with this.

The URL only appends to the URL with this function added, which is really strange.

Thanks for your help.

Excellent that works!

The weird addition of “?t=1652433385086” is still added to the URL but the page loads, the results overlay of the search box also does not close.

Just realised the ?t=1652433385086 url addition is on all pages no matter if in the search or clicking a menu item, in case this helps.

Do you think these things can be fixed maybe?

If not I can deal with it working like this, at least it works ??

Thanks so much!

• This reply was modified 2 years, 9 months ago by chickendipper.

Thank you very much for this.

I have just added it and it is so close now!

The results do not cause the page to reload when clicking but it seems to be adding a strange addition to the end of the URL’s and the page doesn’t actually update but the address bar does.

Does this mean I am out of luck?

Thanks again.

I will try my luck, if not I will have to revert to a non ajax search that takes the user to the normal search page as this will work with ajax.

Here is my url in case I did not explain properly and it could work: https://ukradio.live the search is in the top bar. I think you are right though ??

Oh that really is a huge shame.

I thought I could apply the ajax to the a tags on the search results to fix maybe.

I will have to look for a new search plugin if it isn’t possible without a lot of coding ??

Thanks.

Any chance that these values can be changed to hex instead of rgb?
“background_color”: “rgb(34,34,37)”,
“theme_color”: “rgb(34,34,37)”,

These cause services such as pwa builder to fail when trying to create a windows app for example.

Thanks.