Dynamic loading of geotargeting content multifield

[v1101]

Hello - 

This requirement is in Prod website and not in Author instance.

there is a dynamic component in the page. On selection of the state 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 content fragment Path/variation for each state. In the JCR node level of the page, we capture only the content fragment path and states, and not the actual content of the CF. 

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 content based on selection.

I know this can be done via AJAX, can someone provide some light on this or any other way. Any samples will be greatly helpful.

[raj_mandalapu]

When we change the dropdown we need to refresh the entire page to reflect the changes or we need to refresh only the fragment,

Here, the AJAX will workout, I don't see any other option because at JCR level you are saving node path not the CF content. you must hit a request to the path to get the content.

If you save CF content, then you can load in the every state CF content on the page in the hidden div's and based on the  state selection you can hide or show the content ( which I feel making things more complex )

You can use below  sample JQuery

$.ajax({

    url : "CF_PATH",

    type: "GET",

    data : formData,

    success: function(data, textStatus, jqXHR)

    {

        //replace the div content with the response

    },

    error: function (jqXHR, textStatus, errorThrown)

    {

    }

});

[kautuk_sahni · Accepted solution]

Reply from rajas66269496 

‎When we change the dropdown we need to refresh the entire page to reflect the changes or we need to refresh only the fragment,

Here, the AJAX will workout, I don't see any other option because at JCR level you are saving node path not the CF content. you must hit a request to the path to get the content.

If you save CF content, then you can load in the every state CF content on the page in the hidden div's and based on the  state selection you can hide or show the content ( which I feel making things more complex )

You can use below  sample JQuery

$.ajax({

    url : "CF_PATH",

    type: "GET",

    data : formData,

    success: function(data, textStatus, jqXHR)

    {

        //replace the div content with the response

    },

    error: function (jqXHR, textStatus, errorThrown)

    {

    }

});

[kautuk_sahni · Accepted solution]

Here, the AJAX will workout, I don't see any other option because at JCR level you are saving node path not the CF content. you must hit a request to the path to get the content.

If you save CF content, then you can load in the every state CF content on the page in the hidden div's and based on the  state selection you can hide or show the content ( which I feel making things more complex )

You can use below  sample JQuery

$.ajax({

    url : "CF_PATH",

    type: "GET",

    data : formData,

    success: function(data, textStatus, jqXHR)

    {

        //replace the div content with the response

    },

    error: function (jqXHR, textStatus, errorThrown)

    {

    }

});