Django Bootstrap toolkit 原

#背景#

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樣式的分頁。調用示例：

  {% if is_paginated %}
      {{ page_obj|pagination }}
  {% endif %}
  

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

widget

DBT提供了4個widget，不但提供了對bootstrap特有輸入樣式(如prepend)的支持，還引入了一個新的datepicker插件方便日期的輸入。

• BootstrapUneditableInput 不可編輯字段

• BootstrapTextInput 可以增加前綴，後綴的輸入控件。調用示例：

  prepended = forms.CharField(
      max_length=100,
      help_text=u'I am prepended by a P',
      widget=BootstrapTextInput(prepend='P'),
  )
  

• BootstrapPasswordInput 可以增加前綴、後綴的密碼輸入控件

• BootstrapDateInput 日期輸入控件