Python2.7+Django1.8+Bootstrap3实现增删改查、分页(一)

王朝学院·作者佚名  2016-08-27
窄屏简体版  字體: 小  |  中  |  大  |  超大  

前言

好久没写博客了,这次因为工作原因,实现了一个基于Python2.7+Django1.8+Bootstrap3架构的测试demo,除了常用的增删改查功能外,还增加了分页和批量操作等功能,从前端到后台一条龙,底层数据库使用的是Django自带的SQLite轻量级数据库,后面我将从安装和运行,实现的原理和框架,还有自己的心得体会来讲述这个demo的前生今世,我是很人性化的,源代码将在尾巴提供,虽然水平不行,但若转载还请注明出处,当然,不注明我也不会保留什么什么权利。

安装和配置

首先安装Python2.7,在下一步运行时,请注意选择勾选环境配置工具包,默认是关闭的,如果没设置,安装之后可手动添加"…/Python27"和"…/Python27/Scripts"到环境变量的path中。如果配置成功,进入cmd后,任何路径输入Python,可查看Python的版本信息。一般来说"…/Python27/Scripts"包含如下执行文本:

django-admin.exe

easy_install.exe

pip.exe

在cmd终端输入pip,一般来说会有反应,如果没有,说明未集成批评,则可直接下载:get-pip.py然后运行在终端运行

python get-pip.py

就可以安装 pip,pip安装成功后利用pip安装Django

pip install Django

在python终端环境输入

importdjango

django.get_version()

查看输出的Django版本信息,若打印出来即说明安装成功!

实现和原理

Python集成Django开发框架后,可以通过在cmd命令提示符下建立工程,工程名为learn_models

django-admin.py startPRoject learn_models

再进入到learn_models里面,新建一个app项目

cd learn_models

python manage.py startapp learn

此时目录的结构有这些文件

C:\USERS\SHILEIDING\LEARN_MODELS

│ manage.py

│

├─learn

│ │ admin.py

│ │ models.py

│ │ tests.py

│ │ views.py

│ │__init__.py

│ │

│ └─migrations

│__init__.py

│

└─learn_models

settings.py

settings.pyc

urls.py

wsgi.py__init__.py__init__.pyc

再去官网下载最新的Bootstrap3框架文件http://getbootstrap.com/getting-started/下载的文件夹可以看出有CSS、fonts、js三个(功能相当大),这就是Bootstrap 3的全部,以下就要在刚新建的Django工程集合Bootstrap3,进入learn_models目录,新建一个static文件夹,再在static里面新建一个bootstrap文件夹,将下载的三个文件夹放进去。

回到learn_models目录,进入learn目录里,新建一templates文件夹,里面存放Bootstrap的html界面,如此处新建一文件test.html,要引用Bootstrap 和jQuery等相关库,这里重点是定位存放的static文件

<!DOCTYPE html>{% load staticfiles %}<html><headlang="en"><metacharset="UTF-8"><!--引入jQuery--><scriptsrc="http://apps.bdimg.com/libs/jqueryui/1.10.4/jquery-ui.min.js"></script><scriptsrc="http://code.jquery.com/jquery-latest.js"></script><!--引入 Bootstrap--><linkhref="{% static 'bootstrap/css/bootstrap.min.css' %}"rel="stylesheet"type="text/css"><linkhref="{% static 'bootstrap/css/bootstrap.css' %}"rel="stylesheet"type="text/css"><scripttype="text/javascript"src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script><scripttype="text/Javascript"src="{% static 'bootstrap/js/bootstrap.js' %}"></script><!--[if lt IE 9]>

<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>

<script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>

<![endif]--><title>数据展示平台</title></head><body><!--bootstrap 特性容器--><divclass="container"><h1>Hello, world!</h1></div></body>

</html>

文件开头的{% load staticfiles %}就是加载static目录,为了找到static目录,需要稍微修改下".../learn_models/learn_models/settings.py"中的配置,主要有两块修改

INSTALLED_APPS =('django.contrib.admin','django.contrib.auth','django.contrib.contenttypes','django.contrib.sessions','django.contrib.messages','django.contrib.staticfiles',#注册新建的app'learn',

)

INSTALLED_APPS中添加新建的app,然后配置static相关

STATIC_URL ='/static/'STATICFILES_DIRS=(

os.path.join(BASE_DIR,'static'),

)

将static目录放在STATICFILES_DIRS中,这样就可以load到我们刚下载的bootstrap 了,bootstrap依赖于jQuery库,所以一定要添加,我们这里是直接引用的,如果有下载版本只需放在static里再引用就行。

这时前端html已经可以使用相关bootstrap属性了,但如何通过Django 的http协议访问呢?这就是Django传奇的MVC模型了,刚刚的templates文件夹就是表现层,展示给用户看的前端,views.py负责处理业务逻辑层,处理请求和返回请求,models.py负责数据存取层,处理数据库的相关属性。前端发出的GET或POST请求要通过urls.py映射到views的相关方法中,所以要在urls.py中配置映射关系,这里假设请求路径为http://127.0.0.1:8000/test/则配置为

urlpatterns =[

url(r'^admin/', include(admin.site.urls)),

#前面是正则表达式

url(r'^test/','learn.views.test',name='test'),

]

映射到对应的views.py中,这里简单实现test方法,在views.py中添加即可

#Bootstrap 测试deftest(request):returnrender(request,'test.html')

当浏览器发出test请求后,先通过urls映射到views中的test方法,处理逻辑后推到前端test.html中显示,html显示的内容可以利用下载的bootstrap渲染。

运行

在cmd中cd到learn_models目录下,此时的目录结构如下

C:\USERS\SHILEIDING\LEARN_MODELS

│ manage.py

│

├─learn

│ │ admin.py

│ │ models.py

│ │ tests.py

│ │ views.py

│ │__init__.py

│ │

│ ├─migrations

│ │__init__.py

│ │

│ └─templates

│ test.html

│

├─learn_models

│ settings.py

│ settings.pyc

│ urls.py

│ wsgi.py

│__init__.py

│__init__.pyc

│

└─static

└─bootstrap

├─css

│ bootstrap-theme.css

│ bootstrap-theme.css.map

│ bootstrap-theme.min.css

│ bootstrap.css

│ bootstrap.css.map

│ bootstrap.min.css

│

├─fonts

│ glyphicons-halflings-regular.eot

│ glyphicons-halflings-regular.svg

│ glyphicons-halflings-regular.ttf

│ glyphicons-halflings-regular.woff

│ glyphicons-halflings-regular.woff2

│

└─js

bootstrap.js

bootstrap.min.js

npm.js

可以看到有manage.py,这正是运行的管理器,先同步数据库,然后运行工程

#同步数据库python manage.py makemigrations

python manage.py migrate#运行工程python manage.py runserver

然后打开http://127.0.0.1:8000/test/出现在偏中间的hello world 表明整合成功。

尾巴

本来打算直接解释写好表格管理的基本操作demo的,但想想一开始学习时配置这一层着实走了不少弯路,就临时起意写个略带解释的整合Python、Django、bootstrap 的test工程,后面我将再写一篇,描述Django框架下实现基本操作的博客,这里贡献出demo源码,直接同步下数据库然后运行即可,有兴趣的话可以直接看,里面我注释的很详细,如果有耐心,且听我下回分解!

 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
 
© 2005- 王朝網路 版權所有 導航