As I work on developing a web portal with Freemarker(FTL) as the front end technology, my project revolves around a single FTL page that utilizes a wizard to manage various user requests. The back end is structured using the Spring MVC pattern, where controllers process these user requests. AJAX calls are used to navigate the wizard and display data on the screen.
Whenever a button is clicked, a JavaScript function is triggered which then makes an AJAX call to invoke a controller method. This method executes specific business logic and returns the desired data.
Currently, my goal is to showcase the data retrieved through the AJAX call within a particular section of the FTL page. To achieve this, I'm utilizing @ResponseBody to deliver JSON responses to the AJAX call.
In my current implementation, I am loading the data into a specific division of the screen via AJAX. However, I find myself needing to include HTML tags in the JavaScript section for content loading purposes. Ideally, I would prefer not to mix HTML tags within the Ajax call section. My intention is to return an Object/Entity from the Ajax call and leverage appropriate FTL tags within the required division to retrieve and load the data.
Your help in this matter is greatly appreciated. Thank you!
$.ajax({
type : "GET",
cache:false,
url : "home",
data : {},
success : function(mwaCatlogueProfile) {
alert('data : '+ mwaCatlogueProfile);
console.log("SUCCESS: ", mwaCatlogueProfile);
var respContent = "";
respContent += "<span class='success'> <b>Please find server list:</b>";
respContent += " </br>";
respContent += mwaCatlogueProfile.environment + "</span>";
$("#result").html(respContent);
wizard.show();
},