I have a simple SplitDateTime field:
meeting_datetime_start = forms.SplitDateTimeField(input_date_formats=["%a %d/%m/%Y"], input_time_formats=["%I:%M %p"])
This renders the following HTML:
<input id="id_meeting_datetime_start_0" name="meeting_datetime_start_0" type="text">
<input id="id_meeting_datetime_start_1" name="meeting_datetime_start_1" type="text">
I am using bootstrap, and want to add a custom template to render this HTML differently, such as:
<div class="col-xs-2">
<input id="id_meeting_datetime_start_0" name="meeting_datetime_start_0" type="text">
</div>
<div class="col-xs-3">
<input id="id_meeting_datetime_start_1" name="meeting_datetime_start_1" type="text">
</div>
How can I modify the basic Django template for the SplitDateTimeField?
You have some possible solutions.
1. Subclass SplitDateTimeWidget and redefine it's render method
By subclassing that widget you can inject into result code anything you want. After that just simply use your own widget with default SplitDateTimeField
2. Create inputs in template by hand
Possibly simplest solution, but most ugly in my opinion. Create code in template by hand, using proper variables for name, id, value etc. You must add _0, _1 suffixes and format existing value by hand.
3. Create template tag that will inject additional divs
You can create some template tag or filter that will do some text operations on default template to add additional divs.
Related
I have a text field
<input type="text" value="This is a test." name="mytextbox" size="10"/>
and separated from that a button
<button type = "button" class="btn btn-primary">
<font size="1">Run</font>
</button>
that should update a list and update the value of the text field itself.
Sometimes forms are used in this context, but I would have to wrap the forms tag around the whole template when the input and button are separated on the screen.
Since I am relatively new to Django, I would like to know the best
strategy to solve the problem.
a) Reload the complete page template with changed arguments/context
b) Create a html template of the specific part that extends the main template and only try to render/update this one.
c) Do something smarter.
There are some answers in a (much older) post from 8 years ago but I am interested in the state-of-the-art solution.
I would like to have a little text area in which people can write something and immediately post it to the database. So, I need a way to manage an input from a base template. I know how to do this with normal templates, but I can't figure out how to do it with the base template without writing the same process in every child template of my project.
I have already heard of template processors, but my problem is that I don't want to pass a variable to the base template, but to take it from the base template.
This is the piece of code that is placed in the base template. I need to access the user's input in the textarea and post it to the database.
<form method="POST">
<textarea id="comment" rows="10" cols="80"></textarea> <br>
<button type="submit">Send message</button>
</form>
Thank you very much in advance.
I'm in the process of trying to minimize the amount of code I need to use to render a form with bootstrap styling with the hope of rendering with just {{ form }} but I haven't yet managed to find a way to render a BooleanField with the checkbox before the text.
from django.forms import Form, BooleanField
class MyForm(Form):
field = BooleanField(label='Test Label')
MyForm().as_table()
The above test code will output
<tr><th><label for="id_field">Test Label:</label></th><td><input class="" id="id_field" name="field" type="checkbox" /></td></tr>
But what I'm hoping to achieve is the same look and feel as shown in the bootstrap docs.
<label for="id_field"><input class="" id="id_field" name="field" type="checkbox" />Test Label:</label>
The problem in doing this is that the rendering is handled via the form, where the label and the field are positioned/rendered separately, and I have yet to find a place to override that will allow me to render the widget inside of the label...
Any ideas how I can achieve this?
I don't want to use django-bootstrap3 etc, and I've looked through the source code for them too and cant see anywhere where they've managed to achieve this either.
It turns out this is much more intrinsic to do than it would appear to be and involves providing a form field mixin as well as a custom widget.
All too much work for me to maintain.
However!
django-angular has managed to achieve this with their own CheckboxInput and associated BooleanFieldMixin, since this is something I am planning on using, it has resolved my issue.
i'm trying to bind an input element like this:
{{input value=email type="text" placeholder="Enter email" class=emailError:with-error}}
it works just fine, as long as I try to assign it only 1 class name ".with-error".
how can I assign 2 class names, so it will be: ".with-error .second-class"?
I know how to do it with:
{{bind-attr class=":secondClass emailError:with-error"}}
but this doesn't work with input helper.
Thanks!
This feature is not well documented, but when defining attributes on a Handlebars helper, you can either leave out the quotes to indicate that you want the value of the attribute to be a bound variable, or you can add the suffix "Binding" and then use quotes with an expression similar to the one you would use with {{bind-attr}}.
So, in your case, the following should work:
{{input value=email type="text" placeholder="Enter email" classBinding="emailError:with-error :myClassName"}}
Note how instead of class=myBoundValues we are using classBinding="myBoundValue".
I've got a Django form that is displaying a ClearableFileInput for a CloudinaryImage (from Cloudinary). Things are working great, except when I display the form field, I get a mangled href in the anchor element:
Currently: <cloudinary.CloudinaryImage object at 0x10b3f4ad0> <input type="checkbox" name="logo-clear" id="logo-clear_id" /> <label for="logo-clear_id">Clear</label><br />Change: <input id="id_logo" type="file" name="logo" class="span4" />
Here is the template code I am using:
<div class="fieldWrapper">
<label for="id_logo"><h3>{{ form.logo.label }}:</h3></label>
{{ form.logo|add_class:"span4" }}
<p>{{ form.logo.help_text }}</p>
</div>
The add_class part come from django-widget-tweaks. I've taken the add_class part out with no change in the output.
Here is my form definition:
class OrganizationFormTheme(forms.ModelForm):
pass
class Meta:
fields = ('logo',)
model = Organization
It looks like Django is having problems with the CloudinaryImage's url function. I suspect it is looking for a simple property rather than a function.
Any suggestions on how to handle this? Should I subclass CloudinaryImage and rewrite the url function somehow?
Indeed there was a conflict between the url function and the url property.
We've changed the function to be build_url instead of url.
In addition, you can specify transformation parameters as the url_options parameter when calling the constructor of CloudinaryImage. Then you can use the url property for getting the full Cloudinary URL.
The fix is available in the latest release of the Python library: http://pypi.python.org/pypi/cloudinary