RE: Liferay CE 7.4.43 and links with senna

Jamie Sammons, modified 2 Years ago. Regular Member Posts: 110 Join Date: 3/10/11 Recent Posts

Im trying to figure out how my site will work best with senna.js SPA functionalities. One thing im having problems with is how some links are behaving as they should (normal anchor links on page, the logo link etc), while others reload the whole page like the my navigationmenu made with bootstrap. Some other things that reload the whole page are links in my portlets. 

Could anybody tell me if there is a correct way to insure a link inherits the normal SPA behaviour? window.location=xxx reloads the whole page..
What is the right way to change the location via javascript and have senna working as it should?

Jamie Sammons, modified 2 Years ago. Regular Member Posts: 110 Join Date: 3/10/11 Recent Posts

For posterity:

Why some links, like those in a dropdown menu are ignored, is still a mystery, but you can override the default behaviour of links that dont work and use in javasript: Liferay.navigate(url);. This will make all links work with SPA and the page wont be reloaded in its entirety.

thumbnail
Jamie Sammons, modified 2 Years ago. New Member Posts: 13 Join Date: 4/13/20 Recent Posts

Hi Sebastian, 

First I'd advise you to take a look at this documentation and make sure you are not disabling https://help.liferay.com/hc/en-us/articles/360030752391-Disabling-SPA, by portal-ext, widget or adding in the URL the property 'data-senna-off="true"'. 

Second, if you want the SPA behaviour, don't use the window.location=xxx because for sure will reload the whole page :) replace by "Liferay.Util.navigate(path)".

Saludos.

 

Jamie Sammons, modified 2 Years ago. Regular Member Posts: 110 Join Date: 3/10/11 Recent Posts

No i did want SPA behaviour, but it was missing for about half the links on the page, ie the links made the page reload. Allthough half of them did have the "befora,start,endNavigation" events, ie SPA was working, the other half did not. I did not disable SPA at any point, nor did I disable them for specifik links, I did test the 'data-senna-off' attribute to check if 'data-senna-off=false' would enable links.

And yes The "Liferay.navigate()" or the one you mentionend (havent tested that one), was the solution. Ie catch clicks on the links not working and "Liferay.navigate()" instead. Finding the whole "Liferay.navigate()" was behind a lot of searching. I could not find it mentioned on "learn.liferay.com", although it seem pretty essential.

Now as far as i can find at the moment I have SPA working as it should, with a little McGyver chewing gum and chewing gum packaging (old reference but it still checks out (warning: recursive references)).

Why it does that would be nice to know.