coo_quickanfrage
Select für Formular Manager
HTML-Template: el-form-manager-select.html
HTML
{namespace bh=TYPO3\Bh\ViewHelpers}
{namespace anfrage=TYPO3\CooQuickanfrage\ViewHelpers}
<bh:tmpl.element object="{cObj}">
<bh:variable.typoscript path="plugin.tx_cooquickanfrage.form-manager" as="form-manager">
<f:if condition="{form-manager.config.label}">
<bh:property.text tag="label" class="bh-form-manager__item__label bh-form-manager__label" property="text"
additionalAttributes="{for: '{cObj.allSettings.inputname}-{cObj.uid}'}" />
</f:if>
<div class="bh-form-manager__field bh-form-manager__field--select {f:if(condition: '{cObj.allSettings.style.bh-form-manager__item--required}', then: 'bh-form-manager__field--required')}"
data-bh-form-manager-name-label="{cObj.allSettings.inputname}">
<f:if condition="!{cObj.allSettings.multiple}">
<div class="bh-form-manager__field__icon bh-font-arrow-simple-down"></div>
</f:if>
<f:if condition="{form-manager.config.placeholder} && !{cObj.allSettings.multiple}">
<bh:property.text tag="span"
class="bh-form-manager__field__input bh-form-manager__field__input--property" property="subtext" />
</f:if>
<f:form.select
class="bh-form-manager__field__input bh-form-manager__field__input--select {f:if(condition:'{cObj.allSettings.multiple}',then: 'bh-form-manager__field__input--select--multiple')}"
id="{cObj.allSettings.inputname}-{cObj.uid}" name="{cObj.allSettings.inputname}"
required="{cObj.allSettings.style.bh-form-manager__item--required}"
multiple="{cObj.allSettings.multiple}"
size="{f:if(condition:'{cObj.allSettings.multiple}',then: '{cObj.allSettings.selectSize}')}">
<f:if condition="!{cObj.allSettings.multiple}">
<f:form.select.option value="" selected="1">
<f:if condition="{form-manager.config.placeholder}">{cObj.subtext}{f:if(condition:
'{cObj.allSettings.style.bh-form-manager__item--required}', then: '*')}</f:if>
</f:form.select.option>
</f:if>
<bh:explode string="{cObj.name}" delimiter="<br>" as="options">
<f:for each="{options}" as="option" iteration="i">
<bh:explode string="{option -> f:format.stripTags()} " delimiter=";" as="value">
<f:if condition="{value.1}">
<f:then>
<f:form.select.option value="{value.1}">{value.0}</f:form.select.option>
</f:then>
<f:else>
<f:form.select.option value="{value.0}">{value.0}</f:form.select.option>
</f:else>
</f:if>
</bh:explode>
</f:for>
</bh:explode>
</f:form.select>
<f:be.security.ifAuthenticated>
<bh:property.text class="bh-form-manager__select-edit-dummy" tag="div" rte="false" property="name" />
</f:be.security.ifAuthenticated>
</div>
<f:be.security.ifAuthenticated>
<div class="bh-form-manager__select-property-box">
<div class="bh-form-manager__select-property-box__editor">
<label class="bh-form-manager__select-property-box__editor__label"
data-tooltip="<ul><li>Jede Zeile ist eine Option.</li><li>Wert und Beschriftung der Option werden durch einen Strichpunkt getrennt</li><li>Vor dem Komma steht die Beschriftung, nach dem Strichpunkt der Wert der Option</li><li>Wenn Wert und Beschriftung dieselbe sind, kann pro Zeile auch nur eines angegeben werden.</li></ul><b>Bsp.: angezeigte Beschriftung;wert</b>"
data-tooltip-view="extended">Select-Options</label>
<div class="bh-form-manager__select-property-box__editor__input">
<textarea class="bh-form-manager__select-property-box__editor__textarea"></textarea>
<div class="bh-form-manager__select-property-box__editor__hidden">
<bh:property.text tag="div" rte="false" property="name" />
</div>
</div>
</div>
</div>
</f:be.security.ifAuthenticated>
</bh:variable.typoscript>
</bh:tmpl.element>
Typoscript: el-form-manager-select.typoscript
TYPOSCRIPT
plugin.tx_bh.settings.contentElements.el-form-manager-select < abstract.bhElement
plugin.tx_bh.settings.contentElements.el-form-manager-select {
name = Auswahlfeld
description = Dieses Element kann nur im Formular-Manager verwendet werden
templateFile = el-form-manager-select.html
templatePath = EXT:coo_quickanfrage/Resources/Public/Elements/el-form-manager-items/el-form-manager-select/
settingsForm = EXT:coo_quickanfrage/Resources/Public/Elements/el-form-manager-items/el-form-manager-select/el-form-manager-select-settings.html
iconFile = typo3conf/ext/bh/Resources/Public/Icons/Elemente/select.svg
bheParentElement = el-form-manager
bheSortPriority = 45
options.translate = 1
options.oncreate = advanced
styleOptions {
size < plugin.tx_cooquickanfrage.form-manager.styleOptions.size
}
dummyData.text = Auswahlfeld
dummyData.subtext = Auswahlfeld
dummyData.name = Beschriftung 1;Wert1<br/>Beschriftung 2;Wert2
userClass = bh-form-manager__item bh-form-manager__item--select
}
plugin.tx_cooquickanfrage.form-manager.items := addToList(el-form-manager-select)
bh.page.includeCSSLibs.el-form-manager-select = typo3conf/ext/coo_quickanfrage/Resources/Public/Elements/el-form-manager-items/el-form-manager-select/el-form-manager-select.css
[backend.user.isLoggedIn]
bh.page.includeJS.el-form-manager-select = typo3conf/ext/coo_quickanfrage/Resources/Public/Elements/el-form-manager-items/el-form-manager-select/el-form-manager-select.js
[global]
[bh.isMobile]
bhDefaultMobilePage.includeCSSLibs.el-form-manager-select < bh.page.includeCSSLibs.el-form-manager-select
[global]
Settings-HTML: el-form-manager-select-settings.html
HTML
{namespace bh=TYPO3\Bh\ViewHelpers}
{namespace anfrage=TYPO3\CooQuickanfrage\ViewHelpers}
<bh:form.settingsform content="{cObj}">
<anfrage:manager.item.settings item="{cObj}" />
<div class="bhe-formsettings-option">
<label>Mehrfach Auswahl</label>
<f:form.checkbox name="multiple" value="multiple" checked="{cObj.allSettings.multiple}" />
</div>
<div class="bhe-formsettings-option" data-bhe-form-listener="tx_bh_page[data][content][settings][multiple]"
data-bhe-form-active-on="value" data-bhe-form-active-value="1">
<label>Zeilen (Höhe)</label>
<f:form.textfield type="number" name="selectSize" value="{cObj.allSettings.selectSize}"
additionalAttributes="{min: '0'}" />
</div>
<bh:form.dynamicFields item="{cObj}" settings="{cObj.allSettings.settingsGlobalFields}" />
<f:form.submit value="Speichern" />
</bh:form.settingsform>