CODEWITHSUNDEEP
phpjqueryargumentstypo3fluid
Anu Bhuvanendran Nair
Anu Bhuvanendran Nair

Reputation: 243

TYPO3 Fluid usage in dynamically rendered template

I'm cooking an extension using EXTbase and fluid for TYPO3 v7+ . I'm here.. because I'm rendering my fluid templates based on certain controller conditions.Under a condition I want something like the html code being rendered from a user supplied template file.

I've used jQuery to bypass the situation..

    <script>
        $(function(){
            $("#some_div_id").load("template_file.html");
        });
    </script>

Guess what.. I got the result I expected,but not really..

<div class="clearfix">
    <ul id="image-gallery" class="gallery list-unstyled cS-hidden">
       <f:for each="{slider}" as="user" key="label" iteration="iterator">
          <li data-thumb="{user.src}"> 
              <f:image crop="{user.crop}" treatidasreference="true" src="{user.filepath}" alt="{user.title}" style="width:100%; height:auto;"></f:image>
                <f:if condition="{config.metadata.switch}!= 0">
                  <f:if condition="{user.title}">
                    <p class="light-caption" style="background: {config.metadata.opacity}; color: {config.metadata.color}; font-size: {config.metadata.size}%; text-align:{config.metadata.align};">{user.title}</p>
                  </f:if>
                </f:if>
          </li>
      </f:for>
    </ul>
</div>

This above is the code resulted.. See, the TypoScript variables are untouched.Little embarrassing.!!
Searching round the clock for an answer.Any ideas ?

Upvotes: 0

Views: 1461

Answers (3)

Dimitri Lavren&#252;k
Dimitri Lavren&#252;k

Reputation: 4889

What you need is a partial: https://docs.typo3.org/typo3cms/ExtbaseGuide/Fluid/ViewHelper/Render.html

In your Fluid template you would add a condition based on the variables provided from the controller

<f:if condition="{showPartial1}">
    <f:render partial="SomePartial1" arguments="{_all}" />
</f:if>
<f:if condition="{showPartial2}">
    <f:render partial="SomePartial2" arguments="{_all}" />
</f:if>

The partials are typically added in the Partials folder (should be in the same folder as your Templates folder) like that

  1. Partials/SomePartial1.html
  2. Partials/SomePartial2.html

Upvotes: 2

sven
sven

Reputation: 599

In your controller action you can use $this->view->setTemplate('myDynamicTemplateName'); to use a different template than suggested by the action name.

Refer to: https://typo3.org/api/typo3cms/class_t_y_p_o3_1_1_c_m_s_1_1_fluid_1_1_view_1_1_template_view.html#a9c46c7bfe6a39b26478a2f37aec38d80

Upvotes: 1

Jost
Jost

Reputation: 5850

You are loading the plain template from the server - there is no PHP code involved that could render your template. You need to send the request in a way that the controller action is executed, renders the template, and then sends the rendered result to you.

The simplest way to do this is to use the extension typoscript_rendering. To use it, render a link to your controller action using the ViewHelper that the extension provides. It would look like this:

{namespace helhum=Helhum\TyposcriptRendering\ViewHelpers}

// Other stuff

<helhum:uri.ajaxAction action="actionName" controller="YourController"/>

Maybe you need to add other parameters - the ViewHelper takes the same parameter that the other f:uri.*-ViewHelpers take. In your JS, you can then send a request to that link (maybe put the link into some data-attribute), and will receive the rendered template.

Upvotes: 1

Related Questions