Dynamic Content in Experience Fragment along with DIV

Question

Hello All - I have a dynamic component in the page. On selection of the drop down, The content needs to be refreshed/changed according to the selection. The component is basically a Multifield component with reference/path to the experience fragment Path/variation for each state. In the JCR node of the page, we capture only the experience fragment path and states, and not the actual content of the XF. I have asked for the suggestion in the other forum and I was asked to go for Ajax route. In my case, the content of experience fragment (DIV) should be replaced on the page completely based on the user selection. The XF is stored as cq:page with node and properties and we don't have the complete DIV to replace the content. I don't think if iframe is one of the best solution to include the XF page in the iframe tag.

Whenever I change the state, I have to refresh the browser to see the updated content. I am looking for ways to dynamically change the XF content based on the user selection along with complete DIV.

Any help in this issue is greatly appreciated.

Nirmal_Jose · Accepted Answer

What you are looking for a an SPA like behaviour on a static page. If this is going to be major customer experience in various pages, think of doing an SPA itself using SPA editor.

If this is a one time usecase, you can look for pjax based content delivery, guessing the experience you are looking for is like https://pjax.herokuapp.com/

raj_mandalapu · Answer

Yes, the XF is stored as cq:page with node and properties, but when we hit XF link via AJAX or Angular or SPA, we will get HTML response, it is more on front end work, the FED developer should read this HTML response and replace with the page content.

The XF should have a root layout container to the author content, the FED developer should identify this or you need to provide the root layout container node name to him to read the content.

Without refreshing the page, if we want to dynamically load the content then we must use either AJAX or Angular or some other framework.

Sign up

Login with SSO

Login to the community

Login with SSO

Scanning file for viruses.

This file cannot be downloaded