twig load data from content into field.html.twig - twig

<div class="quote">
<span{{ attributes }}>
{%- for item in items -%}
{{ item.content }}
{%- endfor -%}
</span>
</div>
I tried..
{{ content.field_content_1| Body }} - this errors out
I'm trying to pull in the:
Quotes (Field) / field_content_1 / Entity reference

Related

how to remove line break in twig template containing a for loop and an include?

I would like to remove a line break between multiple html tags (<a>) from a twig template which contains a for loop and an include of another twig template.
{% for child in field.value %}
{% include '#EasyAdmin/crud/field/association_link.html.twig' with {
field: {
value: child,},
} %}
{%- if loop.index < field.value|length -%}
,
{%- endif %}
{% endfor %}
And the twig templated included :
{% set url = ea_url()
.setController('App\\Controller\\Admin\\' ~ get_class(field.value)|split('\\')|last ~ 'CrudController')
.setEntityId(field.value.id)
.setAction('edit') %}
{% if url -%}
{{ field.value|markdown }}
{%- else -%}
{{ field.value|markdown }}
{%- endif -%}
It renders such a result :
<a href=url2>name1<a/>
,
<a href=url2>name2<a/>
How to get this result instead ?
<a href=url2>name1<a/>,
<a href=url2>name2<a/>
2nd row, 6th field : a break line before and after the comma

Multiple Load More OOB Button Sprig

I am trying to create multiple dynamic load more oob buttons using Sprig plugin in Craft CMS and they are appearing properly. But the issue comes up when one button is due to be swapped with the hidden one, it results to all the load more buttons disappearing.
Here is the for loop code that I have tested:
{% for city in cities %}
{% set articleOffset = articleOffset ?? 0 %}
{% set articlesQuery = cityArticles[loop.index0].offset(articleOffset).limit(articleLimit) %}
{% set articles = articlesQuery.all() %}
<div class="filtered-bookmark mb-5">
<span> {{ city.title }}</span>
<div class="row" id="container-{{ city.slug }}">
{% for article in articles %}
{% set featureImage = article.articleFeaturedImage.one().url ?? "" %}
{% set categorySlug = article.channelsCategory.one().channel.one().slug %}
<section class="col-12 col-sm-6 col-xl-4 mb-4">
{#article card template here#}
</section>
{% endfor %}
</div>
{% if articlesQuery.count() > articles|length + articleOffset %}
<button id="{{city.slug}}-oob" sprig
s-val:articleOffset="{{ articleOffset + articleLimit }}"
s-target="#container-{{ city.slug }}"
s-select="#container-{{ city.slug }} section"
s-swap="beforeend"
{{ sprig.trigger == city.slug ~ '-oob' ? 's-swap-oob="true"' }}> View More </button>
{% else %}
<button id="{{ city.slug }}-oob" s-swap-oob="true" style="display: none"></button>
{% endif %}
</div>
{% endfor %}
Asked the question on PutYourLightsOn's Sprig GitHub and got a response. This did the trick:
<button id="{{ city.slug }}-oob" {{ sprig.trigger == city.slug ~ '-oob' ? 's-swap-oob="true"' }} style="display: none"></button>
GitHub link for reference:
https://github.com/putyourlightson/craft-sprig/issues/247

How can I reuse a block to make other ones?

This is what i want (re-use a block for others in order not to code duplicates too much) :
{%- block distance_widget (block_a, block_b, block_c) -%}
{%- if unit -%}
<div class="input-group">
{{- block('form_widget_simple') -}}
<div class="input-group-append">
<span class="input-group-text">{{ unit|default('kg') }}</span>
</div>
</div>
{%- else -%}
{{- block('form_widget_simple') -}}
{%- endif -%}
{%- endblock distance_widget %}
or it may be done like that (i think extend cant be used within a block but maybe there is another methode that can do this) ?
{%- block_a -%}
{%- extends block distance_widget -%}
{%- enblock -%}
{%- block_b -%}
{%- extends block distance_widget -%}
{%- enblock -%}
{%- block_c -%}
{%- extends block distance_widget -%}
{%- enblock -%}
this is what i currently have... (a lot too much code duplicats, its ugly i want a clean code so i want to make a re-usable block) :
{%- block_a -%}
{%- if unit -%}
<div class="input-group">
{{- block('form_widget_simple') -}}
<div class="input-group-append">
<span class="input-group-text">{{ unit|default('kg') }}</span>
</div>
</div>
{%- else -%}
{{- block('form_widget_simple') -}}
{%- endif -%}
{%- enblock -%}
{%- block_b -%}
{%- if unit -%}
<div class="input-group">
{{- block('form_widget_simple') -}}
<div class="input-group-append">
<span class="input-group-text">{{ unit|default('kg') }}</span>
</div>
</div>
{%- else -%}
{{- block('form_widget_simple') -}}
{%- endif -%}
{%- enblock -%}
{%- block_c -%}
{%- if unit -%}
<div class="input-group">
{{- block('form_widget_simple') -}}
<div class="input-group-append">
<span class="input-group-text">{{ unit|default('kg') }}</span>
</div>
</div>
{%- else -%}
{{- block('form_widget_simple') -}}
{%- endif -%}
{%- enblock -%}
It does the trick (it allows to reuse the already defined blocks) :
{{- block('distance_widget') -}}

"block checkbox_widget" draw a checkbox

I'm customizing the checkbox_widget in one form. In the template that draw this form I have:
{%- block checkbox_widget -%}
{% set emailmult1a00 = app.session.get('emailmult1a00') %}
<input type="checkbox" name="{{ emailmult1a00 }}" />
{%- endblock checkbox_widget -%}
It works fine in my form, but it draws a checkbox in place where the block is in the template.
How can I delete this checkbox?
I resolve the problem using a separate Template:
{# templates/form/fields.html.twig #}
{%- block checkbox_widget -%}
{% set emailmult1a00 = app.session.get('emailmult1a00') %}
<input type="checkbox" name="{{ emailmult1a00 }}" />
{%- endblock checkbox_widget -%}
And then, in my form template:
{% form_theme formulario 'form/fields.html.twig' %}

Silex - Symfony Froms - How to wrap each radio button and its label in to separate div for each radio in choice list?

I am using Silex micro faramework with Symfony forms. In twig templet I generate this field using :
...
{{ form_widget(form.transport_selection) }}
...
How can I overwrite this symfony twig form templet to generate wrap for each set (input field and label) in Silex.
This is my twig registration:
use Silex\Provider\FormServiceProvider;
use Symfony\Component\Translation\Loader\YamlFileLoader;
use Symfony\Component\Validator\Constraints as Assert;
$app->register(new Silex\Provider\TwigServiceProvider(), array(
'twig.path' => [
__DIR__.'/App/View',
]
));
How to wrap radio button and label with div for each radio choice ?
output:
<div id="form_transport_selection">
<input type="radio" id="form_transport_selection_0" name="form[transport_selection]" required="required" value="country" checked="checked">
<label for="form_transport_selection_0" class="required">country</label>
<input type="radio" id="form_transport_selection_1" name="form[transport_selection]" required="required" value="abroad">
<label for="form_transport_selection_1" class="required">abroad</label>
</div>
Expected output:
<div id="form_transport_selection">
<div class="radio1">
<input type="radio" id="form_transport_selection_0" name="form[transport_selection]" required="required" value="country" checked="checked">
<label for="form_transport_selection_0" class="required">country</label>
</div>
<div class="radio2">
<input type="radio" id="form_transport_selection_1" name="form[transport_selection]" required="required" value="abroad">
<label for="form_transport_selection_1" class="required">abroad</label>
</div>
</div>
Thanks
You can make new template for this form and redefine radio buttons view
my.form.twig
{% extends "form_div_layout.html.twig" %}
{%- block choice_widget_expanded -%}
<div {{ block('widget_container_attributes') }}>
{% set i=1 %}
{%- for child in form %}
<div class="radio-{{i}}">
{{- form_widget(child) -}}
{{- form_label(child, null, {translation_domain: choice_translation_domain}) -}}
</div>
{% set i=i+1 %}
{% endfor -%}
</div>
{%- endblock choice_widget_expanded -%}
and use it in controller template, where form is shown
{% form_theme form 'my.form.twig' %}
....
{{ form_widget(form.transport_selection) }}
Expanding on MaxP's answer. Make sure to only modify this for radio buttons, you don't want this used in checkboxes! I've added a different class for checkboxes. Note the if/else to do this.
{% extends "form_div_layout.html.twig" %}
{% block choice_widget_expanded %}
<div {{ block('widget_container_attributes') }}>
{% set i=1 %}
{% for child in form %}
{% if form.vars.multiple == false %}
<div class="radio-{{i}}">
{% elseif form.vars.multiple == true %}
<div class="checkbox-{{i}}">
{% endif %}
{{ form_widget(child) }}
{{ form_label(child, null, {translation_domain: choice_translation_domain}) }}
</div>
{% set i=i+1 %}
{% endfor %}
</div>
{% endblock choice_widget_expanded %}
And use it in controller template, where form is shown
{% form_theme form 'my.form.twig' %}
....
{{ form_widget(form.transport_selection) }}
When using Symfony, I recommend overriding all Twig fields in app/Resources/views/Form/fields.html.twig
And then on config.yml you just need to make this available by adding it to twig's config
twig:
form_themes:
- 'Form/fields.html.twig'

Resources