form render does not allow attribute which contains “-”

[Aki Tanaka]

Please help me to solve this problem

http://stackoverflow.com/questions/12480726/data-source-in-bootstrap-typeahead-not-working

-----------------------

I am trying to customize the form template base on this tutorial. As I understand, render() just add some attributes to the tag. For example, I add placeholder = "abc" and it works well.

{% call inserttourbus(id = "formAddNewRow" )  %}

     <div class="fieldWrapper">
         {% if inserttourbus['bustype'].label() %}Bus Type{% endif %}
         {{ inserttourbus['bustype'].render(placeholder="abc")|safe }}
         {% if inserttourbus['bustype'].errors() %}Not filled yet!{% endif %}      
     </div>
{% endcall %}

Here is my problem: - I use bootstrap typeahead for my template so I need to add the following attribute to the inserttourbus textbox

data-provide="typeahead" data-items="4" data-source='["Alabama","Alaska"]'

So it will become

{{ inserttourbus['bustype'].render(placeholder="abc", data-provide="typeahead", data-items="4", data-source='["Alabama","Alaska"]')|safe }}

But the jinja2 engine seems does not accept data-provide, data-items, so on because it contain "-" character. If I changed data-provide to dataprovide, the jinja2 engine can render the code well.

However, in bootstrap typeahead javascript, all variables are defined as data-provide, data-items. If I change them to dataprovide, dataitems, the javascipt stop working.

Please give me a solution: - How to make jinja2 accept attribute which has "-" - Other solutions, advices

[Paolo Casciello]

Hi Aki,

jinja doesn't accept such keyword because keywords must obey to the python syntax.

The only solution i see here (and it's the one i'm using too) is to write the form field explicitly in the template, without using the form helper (at least for such inputs).

I never tried though using a dict and passing it by reference like .render(**specialattributes). You could try and let me know if it works :) But i still prefer the first solution. It's more... pythonic :)

Bye,

  Paolo

[Paolo Casciello]

Of course another easy workaround would be using the javascript api for initializing typeahead instead of the data-* attributes.

[Aki Tanaka]

Hi Paolo,

Thank for the reply.
I decided to write the form field directly to the template.