With PHP using Twig I can do something like this:
layout.twig
<html>
<body>
{% block content %}{% endblock %}
</body>
</html>
form.twig
{% extends "layout.twig" %}
{% block content %}
<div class="form">{% block form %}{% endblock %}</div>
{% endblock %}
login.twig
{% extends form %}
{% block form %}
<form>
<input type="text" name="email" />
<input type="submit">
</form>
{% endblock %}
This way I have a layout for all pages, a layout for pages with forms and login page.
But with Slim I can specify only main layout that is parent for all templates:
layout.slim
html
body ==yield
and special layouts for every page on my site:
login.slim
div.form
form
input type="text" name="email"
input type="submit"
Is there a simple way to realize Twig-like inheritance with more than one level in Slim?
It looks that I found the solution for Slim with Sinatra:
layout.slim
html
body
== yield
form.slim
== slim :layout
div.form
== yield
login.slim
== slim :form
form
input type="text" name="email"
input type="submit"
I believe that in Rails it doesn't exist something like template inheritance, but I believe that it isn't necessary with yield and content_for methods.
For example, you can have a _form.html.slim layout:
.form
= yield
A _login.html.slim partial:
form
input type="text" name="email"
input type="submit"
And when you want to display a login with the form layout, you should do something like:
= render partial: "login", layout: "form"
login.html.slim
= render layout: 'form' do
form
input type="text" name="email"
input type="submit"
Related
i have a problem with customization of my form's style..
I extend the form widget in this normal way:
{{ form_label(form.tipi) }}
{{ form_errors(form.tipi) }}
{{ form_widget(form.tipi) }}
But i receive this bad HTML:
<div id="requests_tipi" class="form-control scroll-select">
<input type="checkbox" id="requests_tipi_1" name="requests[tipi][]" value="1" checked="checked">
<label for="requests_tipi_1">Appartamento</label>
<input type="checkbox" id="requests_tipi_2" name="requests[tipi][]" value="2" checked="checked">
<label for="requests_tipi_2">Casa Colonica</label>
<input type="checkbox" id="requests_tipi_3" name="requests[tipi][]" value="3" checked="checked">
<label for="requests_tipi_3">Garage</label>
<input type="checkbox" id="requests_tipi_4" name="requests[tipi][]" value="4">
<label for="requests_tipi_4">Loft</label>
</div>
I would a list like this:
<ul>
<li><label for="requests_tipi_1">Appartamento</label><input type="checkbox" id="requests_tipi_1" name="requests[tipi][]" value="1" checked="checked"></li>
...
</ul>
How can i do for customize my Symfony Form???
Thanks
This is how you customize rendering for individual field (tipi in your case):
http://symfony.com/doc/current/cookbook/form/form_customization.html#how-to-customize-an-individual-field
and this is where original formatting is defined (and where you can take an "inspiration" :) :
https://github.com/symfony/symfony/blob/master/src/Symfony/Bridge/Twig/Resources/views/Form/form_div_layout.html.twig#L45
So, something like this could work (please note i have not tested, it might be needed to be adjusted), just put following code somewhere at the top of the template file:
{% form_theme form _self %}
{% block _requests_tipi_widget %}
<ul {{ block('widget_container_attributes') }}>
{% for child in form %}
<li>
{{ form_label(child, null, {translation_domain: choice_translation_domain}) }}
{{ form_widget(child) }}
</li>
{% endfor %}
</ul>
{% endblock _requests_tipi_widget %}
I have an application Im building that needs to output some HTML inside a <pre> and <code> tag. I am using prism for the syntax highlighting and it works fine for other languages. The problem is that when I use HTML inside the code tag it either renders the html, or won't highlight with prism because it is output as a string.
The markup is:
<pre>
<code class="language-markup">
<form class="send-to-mobile" method="post">
<input type="text" pattern="[0-9]*" name="phone_number" class="phone_number" />
<input type="submit" value="Text Me" />
</form>
<div class="thanks-message">
<p>The link will be delivered momentarily</p>
</div>
</code>
</pre>
in php twig template I could do:
{% set chunk %}
<div class="foo">
bar {{ another_var_or_helper }}
...
</div>
{% endset %}
{{ chunk }} {# displays div #}
in rails I can do it with render partial or <% chunk = '..' %>. But how to do "twig style"?
Use a Helper function.
module SomeModelNameHelper
def html_chunk
"<div class='foo'>Bar</div>".html_safe
end
end
Then in your view you can call it thusly:
<%= html_chunk %>
What's a nice way to do master/application layouts with Erlydtl? With master/application layout I mean separating the main page layout template from template with the pagecontent, but rendering them as one. Think Ruby on Rails application layouts or ASP.NET Master Pages.
Are you trying to achieve something like:
main.dtl
<html>
<head></head>
<body>
<div id="menu">Menu</div>
<div id="content">
{% block content %}{% endblock %}
</div>
</body>
</html>
page.dtl
{% extends "main.dtl" %}
{% block content %}
Here's my content
{% endblock %}
With tags, you can do this in a gsp:
<g:if test="${someBean?.aCondition}">
<div class="aSection">
...
</div>
</g:if>
What I really want to do is add a second 'class' that either contains the 'display:none' or 'display:block' attributes based the value of '${someBean?.aCondition}'.
The final html would like this:
<div class="aSection hiddenItem">
...
</div>
(the div would have 'shownItem' for its class if ${someBean?.aCondition} is true)
The corresponding css:
.shownItem
{
display: block;
}
.hiddenItem
{
display: none;
}
What's a good way to achieve this?
Easy enough:
<div class="aSection ${someBean?.aCondition ? 'shownItem':'hiddenItem'}">
...
</div>
You can use ${} blocks inside html attributes, no problem, just be sure not to use any double-quotes in your expression block, as that confuses things.
Or if you don't want the attribute displayed at all on some (say for an autofocus tag) condition:
<input name="email" type="text" class="input-small" placeholder="Email" ${!flash.email ? 'autofocus="autofocus"':''} value="${flash.email}">