Django Bootstrap toolkit

发表于1 年 前(2013-06-28 15:58)   阅读（1924） | 评论（0） 14人收藏此文章, 我要收藏

赞1

django bootstrap

目录[-]

背景

简介

标签(tag)

filter

widget

背景

bootstrap为前端的快速开发提供了一个很好的框架；Django则为后端的快速提供了全方位的支持，但是需要自己负责实现前端的视觉部分。一前一后两个框架正好可以结合构建一套完整的开发方案出来。

常规的界面，可以在Django的模板中，直接使用bootstrap的组件、类等工具编写即可。涉及到需要进行表单处理的部分，尤其是涉及到诸如后台等不需要特别美化，而又需要快速开发的部分，这种手工编码的方式显得就有点儿无法接受。

我们知道借助Django的form和widget功能，开发者几乎无需手工编写表单代码，Django会自动按照我们在form(及model)定义的表单结构，自动生成最终的html代码。对于开发者来说，这是一个极大的福音！我们希望在结合bootstrap和Django时不要失去这种优势。

而Django Bootstrap Toolkit正是结合两者优势的有力工具。

简介

Django Bootstrap ToolKit(DBT) 已经发布到pypi，其安装及简单使用方法可见官网。本文对此工具提供的功能做一简单介绍。

标签(tag)

使用bootstrap需要引入其样式表和/或其js库。DBT提供了一组标签方便开发者完成此项工作。 当然此工具是从bootstrap的源码库中直接引入，如果想从其他地方引入，可以不使用此组标签。

• bootstrap_stylesheet_url 输出样式表的url。bootstrap版本库中的样式表地址。

• bootstrap_stylesheet_tag 输出引入样式表的代码。<link rel="stylesheet" href="...">

• bootstrap_javascript_url 输出js的url。bootstrap版本库中的js地址。

• bootstrap_javascript_tag 输出引入js的代码。 <script src="..."></script>

• active_url 如果当前url与给定url相同则输出output参数的值(默认active)。常用于设置当前菜单高亮等场景。 调用示例：{% active_url request,'/home'

filter

借助DBT提供的非常有限的几个过滤器(filter)即可实现前面提到的快速开发的需求。

• as_bootstrap 按照bootstrap的规范生成表单或者字段。调用示例：

渲染整个表单： {{ form|as_bootstrap}} 或渲染单个字段：`{{ form.field|as_bootstrap}}

• is_disabled 如果字段不可编辑或者其widget包含readonly、diabled属性，则返回True

• is_enabled 与is_disabled相反

• bootstrap_input_type 输出input的类型

• pagination 生成bootstrap样式的分页。调用示例：

  ?

  1

  2

  3

  {%ifis_paginated %}

      {{ page_obj|pagination }}

  {% endif %}

• split 以给定分隔符分割字符串

widget

DBT提供了4个widget，不但提供了对bootstrap特有输入样式(如prepend)的支持，还引入了一个新的datepicker插件方便日期的输入。

• BootstrapUneditableInput 不可编辑字段

• BootstrapTextInput 可以增加前缀，后缀的输入控件。调用示例：

  ?

  1

  2

  3

  4

  5

  prepended = forms.CharField(

      max_length=100,

      help_text=u'I am prepended by a P',

      widget=BootstrapTextInput(prepend='P'),

  )

• BootstrapPasswordInput 可以增加前缀、后缀的密码输入控件

• BootstrapDateInput 日期输入控件