title: Rendering Spring ModelAndView Object with Thymeleaf
body: <p>I have a controller like this :</p>
  
  <pre><code>    @Autowired
      ServletContext servletContext;
  
      public ModelAndView handleLogin(Locale locale, Model viewModel, HttpServletRequest request)
                      throws Exception {
              [...]
              ModelAndView scheduler = new ModelAndView("scheduler");
              scheduler.addObject("body", SchedulerCreator.getScheduler().render());
  
              return scheduler;
      }
  </code></pre>
  
  <p>The render() function returns just a string with html/css/javascript, so I should just place it on a page as html.</p>
  
  <p>I attempted placing it in my Thymeleaf template like this :</p>
  
  <pre><code>    &lt;html xmlns:th="http://www.thymeleaf.org"&gt;
        &lt;head th:include="layout :: htmlhead" th:with="title='DoctorScheduler'"&gt;&lt;/head&gt;
        &lt;body&gt;
          &lt;div th:replace="layout :: navbar"&gt;(navbar)&lt;/div&gt;
          &lt;div th:text="${body}" id="scheduler"&gt;&lt;/div&gt;
          &lt;div th:include="layout :: footer" id="footer"&gt;(footer)&lt;/div&gt;
        &lt;/body&gt;
      &lt;/html&gt;
  </code></pre>
  
  <p>On the the screen, I get header and footer displayed well but for the scheduler, I only get the html code displayed and not rendered :</p>
  
  <pre><code>    &lt;script src="/javaplanner/dhtmlxscheduler.js" type="text/javascript" charset="utf-8"&gt;&lt;/script&gt; &lt;script src="/javaplanner/ext/dhtmlxscheduler_url.js" type="text/javascript" charset="utf-8"&gt;&lt;/script&gt; &lt;script src="/javaplanner/ext/dhtmlxscheduler_pdf.js" type="text/javascript" charset="utf-8"&gt;&lt;/script&gt; &lt;link rel="stylesheet" href="/javaplanner/dhtmlxscheduler.css" type="text/css" charset="utf-8"&gt; &lt;div id='scheduler_here' class='dhx_cal_container' style='width:900px;height:100%;'&gt; &lt;div class='dhx_cal_navline'&gt; &lt;div class='dhx_cal_export pdf' id='export_pdf' title='Export to PDF' onclick='scheduler.toPDF("http://dhtmlxscheduler.appspot.com/export/pdf", "color")'&gt; &lt;/div&gt; &lt;div class='dhx_cal_prev_button'&gt; &lt;/div&gt; &lt;div class='dhx_cal_next_button'&gt; &lt;/div&gt; &lt;div class='dhx_cal_today_button'&gt;&lt;/div&gt; &lt;div class='dhx_cal_date'&gt;&lt;/div&gt; &lt;div class='dhx_cal_tab' name='month_tab' style='left:76px;'&gt;&lt;/div&gt; &lt;div class='dhx_cal_tab' name='week_tab' style='left:140px;'&gt;&lt;/div&gt; &lt;div class='dhx_cal_tab' name='day_tab' style='left:204px;'&gt;&lt;/div&gt; &lt;/div&gt; &lt;div class='dhx_cal_header'&gt;&lt;/div&gt; &lt;div class='dhx_cal_data'&gt;&lt;/div&gt; &lt;/div&gt; &lt;script&gt; scheduler.config.serverLists = {}; scheduler.locale.labels.section_time = 'When'; scheduler.locale.labels.section_appointmentName = 'Description'; scheduler.locale.labels.section_patientId = 'Patient ID'; scheduler.locale.labels.section_appointFor = 'Appoint For'; scheduler.locale.labels.section_staffId = 'Staff ID'; scheduler.locale.labels.section_assistantId = 'Assistant ID'; scheduler.locale.labels.section_departmentWardId = 'Dept. Ward ID'; scheduler.locale.labels.section_appointmentStatusId = 'Appt. Status ID'; scheduler.locale.labels.section_referenceConsultancyId = 'Ref. Consult. ID'; scheduler.locale.labels.section_nextAppointmentId = 'Next. Appt. ID'; scheduler.locale.labels.section_consultancyId = 'Consultancy ID'; scheduler.locale.labels.section_firmCode = 'Firm Code'; scheduler.config.lightbox.sections = [ {"name":"time", "type":"time", "map_to":"auto"}, {"height":40, "name":"appointmentName", "type":"textarea", "map_to":"appointmentName"}, {"name":"patientId", "type":"select", "map_to":"patientId", "options":scheduler.serverList("patientsLookup")}, {"name":"appointFor", "type":"select", "map_to":"appointFor", "options":scheduler.serverList("appointForLookup")}, {"name":"staffId", "type":"select", "map_to":"staffId", "options":scheduler.serverList("staffLookup")}, {"name":"assistantId", "type":"select", "map_to":"assistantId", "options":scheduler.serverList("assistantsLookup")}, {"name":"departmentWardId", "type":"select", "map_to":"departmentWardId", "options":scheduler.serverList("wardLookup")}, {"name":"appointmentStatusId", "type":"select", "map_to":"appointmentStatusId", "options":scheduler.serverList("apptStatusLookup")}, {"name":"referenceConsultancyId", "type":"select", "map_to":"referenceConsultancyId", "options":scheduler.serverList("refConsLookup")}, {"name":"nextAppointmentId", "type":"select", "map_to":"nextAppointmentId", "options":scheduler.serverList("nextApptLookup")}, {"name":"consultancyId", "type":"select", "map_to":"consultancyId", "options":scheduler.serverList("consultantsLookup")}, {"height":40, "name":"firmCode", "type":"textarea", "map_to":"firmCode"} ]; scheduler.config.details_on_dblclick = true; scheduler.config.dblclick_create = true; scheduler.config.scroll_hour = 8; scheduler.config.skin = 'terrace'; scheduler.config.details_on_create = true; scheduler.templates.lightbox_header = function(start,end,ev){ var temp = "";temp += "&lt;strong&gt;Appointment&lt;/strong&gt;"; return temp; }; scheduler.init('scheduler_here',new Date(2014, 8, 10, 15, 55, 33)); scheduler.config.prevent_cache = true; scheduler.load("appointment", "json"); var dp = new dataProcessor("appointment"); dp.init(scheduler); dp.setTransactionMode("POST", false);&lt;/script&gt;
  </code></pre>
  
  <p>What's wrong ? How to place the html/css/javascript string within my Thymeleaf template to get it rendered ? Any Thymeleaf tag I may ignore ? Any other method/approach ? 
  Any input is welcome, thank you for your help !</p>