Code Monkey home page Code Monkey logo

django-forms-bootstrap's Introduction

Django Forms Bootstrap

Pinax

Pinax is an open-source platform built on the Django Web Framework. It is an ecosystem of reusable Django apps, themes, and starter project templates. This collection can be found at http://pinaxproject.com.

django-forms-bootstrap

django-forms-bootstrap is a simple bootstrap filter for Django forms. Extracted from the bootstrap theme for Pinax.

Getting Started

Include django-forms-bootstrap in your requirements file and django_forms_bootstrap in your INSTALLED APPS.

Make sure your template loader finders includes app directories.

To style forms, add the following to the top of your template

{% load bootstrap_tags %}

and include your form using something like the following markup:

<form>
    <legend>My Form</legend>
    {% csrf_token %}
    {{ form|as_bootstrap }}
    <div class="form-actions">
      <a href="#back" class="btn">Go back</a>
      <button type="submit" class="btn btn-primary">Save changes</button>
    </div>
</form>

Specifying Form Layouts

Bootstrap includes styles for three types of forms. To change the display of your form, add one of the following class attributes to your form tag and use the appropriate template filter:

Class Template filter Description
.form-vertical {{ form|as_bootstrap }} Labels over controls (default)
.form-horizontal {{ form|as_bootstrap_horizontal }} Labels on same line as controls
.form-inline {{ form|as_bootstrap_inline }} Compact style with inline-block controls

Documentation

The django-forms-bootstrap documentation is currently under construction. If you would like to help us write documentation, please join our Pinax Project Slack team and let us know! The Pinax documentation is available at http://pinaxproject.com/pinax/.

Contribute

See this blog post http://blog.pinaxproject.com/2016/02/26/recap-february-pinax-hangout/ including a video, or our How to Contribute (http://pinaxproject.com/pinax/how_to_contribute/) section for an overview on how contributing to Pinax works. For concrete contribution ideas, please see our Ways to Contribute/What We Need Help With (http://pinaxproject.com/pinax/ways_to_contribute/) section.

In case of any questions we recommend you join our Pinax Slack team (http://slack.pinaxproject.com) and ping us there instead of creating an issue on GitHub. Creating issues on GitHub is of course also valid but we are usually able to help you faster if you ping us in Slack.

We also highly recommend reading our Open Source and Self-Care blog post (http://blog.pinaxproject.com/2016/01/19/open-source-and-self-care/).

License & Attribution

Django Forms Bootstrap is released under the MIT license. It does not include any styles or scripts from the Bootstrap project.

Code of Conduct

In order to foster a kind, inclusive, and harassment-free community, the Pinax Project has a code of conduct, which can be found here http://pinaxproject.com/pinax/code_of_conduct/. We ask you to treat everyone as a smart human programmer that shares an interest in Python, Django, and Pinax with you.

Pinax Project Blog and Twitter

For updates and news regarding the Pinax Project, please follow us on Twitter at @pinaxproject and check out our blog http://blog.pinaxproject.com.

django-forms-bootstrap's People

Contributors

atbaker avatar bouttier avatar brosner avatar chromano avatar cvrebert avatar d1ff avatar eliasfernandez avatar jerzyk avatar jtauber avatar lukeman avatar paltman avatar rizumu avatar sefakilic avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

django-forms-bootstrap's Issues

Update PyPi

Hi!
This module on PyPi dates from 2014 with the version 3.0.1 witch its the same version here in GitHub. Some improvements have been made until now shouldn’t the PyPi be update with the this improvements or at least change the Github version ?

Is Django 2.0 Supported?

I checked the commits and the builds and I don't see anything about Django 2.0.

Can anyone comment if they're running OK with 2.0? ty!

Selected Boxes are not selected anymore after rendering the form

If I use a form field like this:

categories = forms.ModelMultipleChoiceField(queryset=Categories.objects.all(), widget=forms.CheckboxSelectMultiple)

and send the form with one of the boxes selected it is not selected in the resulting response object anymore. When I use {{ form.as_p }} or just {{ form.categories }} instead of {{ form|as_bootstrap }}, the box is still selected as it should be!

I hope you know what I mean! :-)

File input is not properly rendered

I have a form with a file input and its file selection button is cut. I've tried changing it's properties in a custom css file, but I couldn't fix it.

This is how it looks like: https://www.dropbox.com/s/817f0jxvmjcgimh/file-input.png?dl=0

And this is the relevant html rendered by as_bootstrap filter:

<form enctype="multipart/form-data" action="" method="post" class="form-vertical">
  <div id="div_id_picture" class="form-group  ">
    <label for="id_picture" class="control-label  ">Picture</label>
    <div class="">
      <input class=" form-control" id="id_picture" name="picture" type="file" />
    </div>      
  </div>
</form>

radioselect rendering bug

In fields.html you have the following for radioselect:

"if choice.0 == field.value " to see if a radio should be checked

However, the equality test only work properly when chioices.0 is a unicode (field.value always is). However choices.0 could be any python type since it comes from the choices field in the FormField. Therefore, none of the radios will get checked whenever its a non-unicode type, even if the underlying values are the same.

How I fixed it is by changing everything to string as follows. You might choose to do something else:

if choice.0|stringformat:"s" == field.value|stringformat:"s"

Cheers,
azarias

Changing form col-mm-x

Is there a way to apply a col-mm-x class to form items?
As an example, I need to render two text fields in one line. So they both should be col-md-6.
Thanks.

Add 2.0.3.post2 to PyPi

I ran across the RadioSelect bug fixed in 48b966f, and see that the version number was bumped to 2.0.3.post2 after the fix was merged in.

Is there a chance that 2.0.3.post2 could be added to PyPi? I'm currently just pinning to ad7c426 and installing from GitHub. I've got several sites still using Bootstrap 2.x, so I can't jump to django-forms-bootstrap 3.x just yet.

Thanks!

Django updated fields in later versions and accessing choice labels and values has changed

Hello! I was having trouble rendering radio buttons using your bootstrap filter, and after some trial and error in field.html, I was able to update that template to handle radio buttons. The following update to this template solves this problem:

{% if field|css_class == "radioselect" %}
    <div class="{{ css_classes.wrap }}">
        {% include "bootstrap/_field_errors_block.html" %}
        {% for choice in field %}
            <div class="radio">
                <label>
                    <input type="radio" {% if choice.choice_value|stringformat:"s" == field.value|stringformat:"s" %}checked="checked" {% endif %} name="{{ field.html_name }}" id="id_{{ field.html_name }}_{{ forloop.counter }}" value="{{ choice.choice_value }}"> {{ choice.choice_label }}
                </label>
            </div>
        {% endfor %}
        {% include "bootstrap/_field_help_text.html" %}
    </div>
{% endif %}

The main change involved updating the array the for loop loops over from field.field.choices to simply field. From there, one can access the value and label with {{ choice.choice_value }} and {{ choice.choice_label }}. I'm, of course, not sure if this is the best way to update this filter, and I haven't attempted to implement any of the other css_classes in field.html.

Exception Type: TemplateSyntaxError Exception Value: Invalid filter: 'css_class'

I am getting the following error:

Template error

In template c:\users\wings\fg-env\lib\site-packages\django_forms_bootstrap\templates\bootstrap\field.html, error at line 8
Invalid filter: 'css_class'

1 {% load bootstrap_tags %}
2
3 {% if field.is_hidden %}
4 {{ field }}
5 {% else %}
6


7
8 {% if field.label and not field|css_class == "checkboxinput" %}

TemplateSyntaxError at /naturel/naturelcalendar/calendar/month/calendar/

Invalid filter: 'css_class'

Request Method: GET
Request URL: http://localhost:8000/naturel/naturelcalendar/calendar/month/calendar/
Django Version: 1.3.3
Exception Type: TemplateSyntaxError
Exception Value:

Invalid filter: 'css_class'

Exception Location: C:\Users\Wings\fg-env\lib\site-packages\django-1.3.3-py2.7.egg\django\template\base.py in find_filter, line 320
Python Executable: C:\Users\Wings\fg-env\Scripts\python.exe
Python Version: 2.7.3
Python Path:

['C:\Users\Wings\bumpmd\apps',
'C:\Users\Wings\bumpmd',
'C:\Users\Wings\fg-env\lib\site-packages\setuptools-0.6c11-py2.7.egg',
'C:\Users\Wings\fg-env\lib\site-packages\pip-1.1-py2.7.egg',
'C:\Users\Wings\fg-env\lib\site-packages\django_avatar-1.0.5-py2.7.egg',
'C:\Users\Wings\fg-env\lib\site-packages\pil-1.1.7-py2.7-win32.egg',
'C:\Users\Wings\fg-env\lib\site-packages\django_crudgenerator-0.0.7-py2.7.egg',
'C:\Users\Wings\fg-env\lib\site-packages\django-1.3.3-py2.7.egg',
'C:\Windows\system32\python27.zip',
'C:\Users\Wings\fg-env\DLLs',
'C:\Users\Wings\fg-env\lib',
'C:\Users\Wings\fg-env\lib\plat-win',
'C:\Users\Wings\fg-env\lib\lib-tk',
'C:\Users\Wings\fg-env\Scripts',
'C:\python27\Lib',
'C:\python27\DLLs',
'C:\python27\Lib\lib-tk',
'C:\Users\Wings\fg-env',
'C:\Users\Wings\fg-env\lib\site-packages']

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.