Skip to main content
Back to all examples

Code example

As the title says. Builds the html Object like: id="#s1043" data-test="{"myVarName":"1"}"

Here output was quoted but jquery read it without problems and it's validating.

Description
HTML5 data attribute as JSON data in fluid contentelement
Author
githubrsys
Creation date
Extensions
FluidTYPO3.Fluidcontent FluidTYPO3.Vhs
Tags
Content
Files
test.html
<div xmlns="http://www.w3.org/1999/xhtml" lang="en"
xmlns:v="http://typo3.org/ns/FluidTYPO3/Vhs/ViewHelpers"
xmlns:flux="http://typo3.org/ns/FluidTYPO3/Flux/ViewHelpers"
xmlns:f="http://typo3.org/ns/TYPO3/Fluid/ViewHelpers">
<f:layout name="Content"/>
<f:section name="Configuration">
<flux:form id="foo" label="bar" description="Lorem" options="{useTypoScript: 0, group: 'Foo', Fluidcontent: {sorting: 400}, icon: '{f:uri.resource(path: \'Icons/foo.png\')}'}">
<flux:form.section name="bar">
<flux:field.select name="individualFoo" items="default" default="default" label="bar"/>
</flux:form.section>
</flux:form>
</f:section>
<f:section name="Preview">
<flux:widget.grid/>
</f:section>
<f:section name="Main">
<v:asset name="foo{record.uid}" dependencies="jquery" debug="0" fluid="TRUE">
<script>console.log($('#s{record.uid}').data('test').myVarName)</script>
</v:asset>
<v:variable.set value="{myVarName:individualFoo}" name="iFoo"/>
<div id="s{record.uid}" data-test='{iFoo -> v:format.json.encode()}'></div>
</f:section>
</div>
view raw test.html hosted with ❤ by GitHub