I have the following structure:
templates
- base.njk
pages
- index.njk
components //my macro's
button
- button.njk
- button.scss
So when I do an import of my macro in my page:
{% import 'button/button.njk' as btn %}
This doesnt work, it loads the button because it doesnt say it can't find the template but when I try to call my macro:
{{ btn() }}
It throws an error saying:
Unable to call "btn", which is not a function
but when its not in the 'button' folder it works.
I just want to know if there's a way of maintaining this structure and get this to work?
Thanks
Try
{{ btn.your-macros-name() }}
or
{% from 'button/button.njk' import your-macros-name as btn %}
{{ btn() }}
you should wirte your code like this
you can import this in any .njk or .html file except button.njk
{% import "button.njk" as btn %}
Related
I'm using Symfony to create a form. Between the form label and the widget where the user enters data I have a button that when pressed displays text prompts to help guide the user. This works fine and when the user clicks on the button it correctly displays the text, however it also displays the error message for the field, saying that the field cannot be blank. I don't need the error displayed until the form is submitted so it seems to be displaying it too early. Many thanks for any suggestions.
Here is the relevant part of the template:
{{ form_start(form) }}
{{ form_label(form.field1, 'My Custom Task Label') }}
<button onclick="myFunction()">Click to display prompts</button>
<div id="myDIV" style = "display:none">
This is a helpful prompt.
</div>
{{ form_widget(form.field1) }}
<script>
function myFunction() {
var x = document.getElementById("myDIV");
if (x.style.display === "none") {
x.style.display = "block";
} else {
x.style.display = "none";
}
}
</script>
{{ form_end(form) }}
buttons by default are submit buttons. your button doesn't indicate any type, so it's of submit type. solution: set type to "button":
<button type="button" onclick="myFunction()">Click to display prompts</button>
otherwise it's sending the form / trying to send the form, obviously catching the errors / required fields, hence displaying an error.
I embedded template Stencil in my project (Kitura https://github.com/IBM-Swift/Kitura ,template engine Stencil https://github.com/kylef/Stencil#include). I don't understand how to use tag {% include "comment.html" %}.
my example , but not work.
example.stencil.html
<html>
<head>
hello example
{% include "include.stencil.html" %}
</head>
</html>
include.stencil.html
<b>I'm here</b>
code swift
import Stencil
let pathTemp=Path("include.stencil.html")
let context = Context(dictionary: ["loader": TemplateLoader(paths: [pathTemp])])
do {
let template = try Template(named: fileName)
let rendered = try template.render(context)
return rendered
}catch
{
return "Error:\(error)"
}
Error :Error:'include.stencil.html' template not found in
../include.stencil.html
How to use it, help me plz. :)
It looks like it's because you have included your filename in the path. The path should be just the path to the file's location, excluding the name of the file itself.
let pathTemp=Path("/path/to/my/file/")
I have search panel(basic form with keyword), now I need to show this form on all pages, how could I do that? If I create action in controller and render
{{ render(controller('WebPortalBundle:Default:searchForm')) }}
in ::base.html.twig, form doesn't submit anything.
Could someone advise me with this issue?
Symfony create a sub-request for it. You should to pass master request object to this action and use it to handle form:
{{ render(controller('WebPortalBundle:Default:searchForm', {request: app.request})) }}
and in controller do something like:
class DefaultController extends Controller
{
public function searchFormAction(Request $request)
{
// other code...
$form->handleRequest($request);
}
}
I'd like to create a project gh-pages, and i've installed jekyll and pygments locally.
But while the website launched, the code snippets displayed without any color but a background.
And even i pushed them into github, it also displayed without any color.
the address of my page is http://leftstick.github.io/angularjs-requirejs-skeleton/,
Can someone tell why it seems didn't work?
Thanks
You use backticks (````) to highlight but it doesn't work. You'de better use {% highlight JavaScript %} tag.
This does the trick :
{% highlight JavaScript %}
(function(require) {
var baseUrl = '/';
require.config({
baseUrl: baseUrl,
paths: {
//configure the path
}
//anything else, place it here if you need
});
var preloads = [];//place your preloads path ids here
//Load all preload dependencies
require(preloads, function() {
require(['js/boot']);
});
}(require));
{% endhighlight %}
I have 2 entities...
Contract (id, clientName, contractCities)
ContractCity (id, name)
Contract has a oneToMany relationship with ContractCities
oneToMany:
contractCities:
targetEntity: ContractCity
mappedBy: contract
cascade: [persist, remove]
ContractCities a manyToOne association with a Contract
manyToOne:
contract:
targetEntity: Contract
inversedBy: contractCities
joinColumn:
name: contract_id
referencedColumnName: id
When editing/creating the Contract I would like to be able to dynamically add new cities (beyond the minimun requirement of 3). I've attempted to follow the Symfony2 embedded forms cookbook Here
ContractType Form
->add('contractCities', 'collection', array(
'type' => new ContractCityType(),
'allow_add' => true,
'allow_delete' => true,
'by_reference' => false
))
section of Twig template to display cities form
<ul class="contractCities" data-prototype="{{ form_widget(form.contractCities.vars.prototype)|e }}">
{% for city in form.contractCities %}
<li>
{{ form_label(city, loop.index) }}
{{ form_widget(city.name, {'attr': {'placeholder' : 'City, State'} }) }}
</li>
{% endfor %}
</ul>
Some Controller Code to ensure at least 3 city fields
$cityCount = count($contract->getContractCities());
if($cityCount <3) {
$needCities = 3 - $cityCount;
for($i=0; $i<$needCities; $i++){
$city = new ContractCity();
$city->setContract($contract);
$contract->addContractCity($city);
}
}
$form = $this->createForm(new ContractType, $contract);
$form->handleRequest($request);
if($form->isValid()) {
$em = $this->getDoctrine()->getManager();
$em->persist($contract);
$em->flush();
$id = $contract->getId();
return $this->redirect($this->generateUrl('Intranet_contract_edit', array('id'=>$id)));
}
When I click my 'New City' link that shows up at the bottom of the list, I get a new form field, and can Input the city name. However, on submit nothing seems to happen. I can edit the existing cities and the changes are saved, but any new cities i have added vanish.
My understanding is that Contract->AddCity or ->AddContractCity or something of that nature should be called, but that does not appear to happen. Any idea what I am doing wrong?
UPDATE: When I submit the form I do not see the additional cities showing up in the POST data, headed to google...
SOLVED: While looking at the source code using the chrome 'inspect element' on one of the prototype fields, I noticed that it showed the forms closing tag was rendered prematurely (though it looked fine when using view source). I was using form_start and form_end, but they were in different divs (twitter bootstrap "rows"). It seemed like the form closing tag was being auto rendered right before the closing tag of the div that contained the form_start. I moved the form_start and form_end so that they were the outer most elements of my view (putting them in the same "container" div) and everything is working fine now. Wtf.
Screenshot visual aide: http://imgur.com/hrgOV9T
SOLVED: While looking at the source code using the chrome 'inspect element' on one of the prototype fields, I noticed that it showed the forms closing tag was rendered prematurely (though it looked fine when using view source). I was using form_start and form_end, but they were in different divs (twitter bootstrap "rows"). It seemed like the form closing tag was being auto rendered right before the closing tag of the div that contained the form_start. I moved the form_start and form_end so that they were the outer most elements of my view (putting them in the same "container" div) and everything is working fine now. Wtf.
Screenshot visual aide: http://imgur.com/hrgOV9T