Code Monkey home page Code Monkey logo

django-bootstrap-toolkit's Introduction

Django Toolkit for integration with Bootstrap

PyPi version

PyPi downloads

The easiest way to use Bootstrap in your Django project. What is Bootstrap? You can find out all about it here: http://getbootstrap.com

Bootstrap3 Support

A new app was started to provide support for Bootstrap3. This means that Bootstrap2 apps can continue to use this package. For Bootstrap3 support, please use https://github.com/dyve/django-bootstrap3.

Installation

  1. Install using pip:

     pip install django-bootstrap-toolkit
    
  2. Add to INSTALLED_APPS:

     'bootstrap_toolkit',
    

Alternatively, you can add django-bootstrap-toolkit to your requirements.txt.

If you want to hack django-bootstrap itself, clone this repo and call pip install -e ..

Use in templates

{% load bootstrap_toolkit %}

# Using a filter

<form action="/url/to/submit/" method="post">
    {% csrf_token %}
    {{ form|as_bootstrap }}
    <div class="form-actions">
        <button type="submit" class="btn btn-primary">Submit</button>
    </div>
</form>

# Using template tags

<form action="/url/to/submit/" method="post" class="form">
    {% csrf_token %}
    {% bootstrap_form form layout="vertical" %}
    <div class="form-actions">
        <button type="submit" class="btn btn-primary">Submit</button>
    </div>
</form>

Use in forms

class TestForm(forms.Form):
    date = forms.DateField(
        widget=BootstrapDateInput(),
    )
    title = forms.CharField(
        max_length=100,
        help_text=u'This is the standard text input',
    )
    uneditable = forms.CharField(
        max_length=100,
        help_text=u'I am uneditable and you cannot enable me with JS',
        initial=u'Uneditable',
        widget=BootstrapUneditableInput()
    )
    prepended = forms.CharField(
        max_length=100,
        help_text=u'I am prepended by a P',
        widget=BootstrapTextInput(prepend='P'),
    )

More examples

See Django project demo_project/demo_app for more examples.

TODO

  • Create a more easy way to customize BootstrapDateInput

Questions

Do you have a question about the usage of this toolkit in your Django project? Please ask it on StackOverflow.com so others can help out and/or learn. Label your question django-bootstrap-toolkit if possible.

http://stackoverflow.com/

Bugs and requests

If you have found a bug or a request for additional functionality, please use the issue tracker on GitHub.

https://github.com/dyve/django-bootstrap-toolkit/issues

About

django-bootstrap-toolkit is written by Dylan Verheul ([email protected]).

History

When building my first Django project with Bootstrap I went looking for available open source applications that connected Django and Bootstrap.

I found https://github.com/tzangms/django-bootstrap-form. The approach to template tags and filters seemed right, but Bootstrap does so much more than just forms.

This is how django-bootstrap-toolkit started. I used ideas from other Django apps. The code was started from scratch.

License

You can use this under Apache 2.0. See LICENSE file for details.

Thanks

  • to Twitter, @fat and @mdo for building and releasing Bootstrap
  • to the Django community for Django
  • to the authors of django-bootstrap-form for the inspiration
  • to Stefan Petre and Andy Rowles for the datepicker https://github.com/eternicode/bootstrap-datepicker

django-bootstrap-toolkit's People

Contributors

aflx avatar conrado avatar dyve avatar fengsi avatar gabejackson avatar kov avatar luzfcb avatar madjar avatar martinth avatar njheath avatar petry avatar phughes avatar samdolan avatar zokis avatar

Watchers

 avatar  avatar

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.