整合Django和jquery-easyui
测试环境
win7 64
Python 3.4.0
jquery-easyui-1.5.1
下载地址1:http://www.jeasyui.com/download/index.php
下载地址2:http://pan.baidu.com/s/1i4TQK5n
jquery-1.5.1.min.js
下载地址:http://pan.baidu.com/s/1o78HO4y
环境配置
配置jquery-easyui
解压下载的jquery-easyui-1.5.1.zip,重命名解压后的文件目录为jquery-easyui,然后在放入应用的static目录下(例:F:\project\autotest\autotest\static\jquery-easyui)
把下载的jquery-1.5.1.min.js,放到jquery-easyui根目录下
测试配置是否成功
新建templates/autotest目录下分别新建testeasyui.html,index.html
testeasyui.html
<html>
<title>Accordion - jQuery EasyUI Demo</title>
{% load staticfiles %}
<script type="text/javascript" src="{% static 'jquery-easyui/jquery-1.5.1.min.js' %}"></script>
<link rel="stylesheet" type="text/css" href="{% static 'jquery-easyui/themes/default/easyui.css'%}" />
<link rel="stylesheet" type="text/css" href="{% static 'jquery-easyui/themes/icon.css'%}" />
<script type="text/javascript" src="{% static 'jquery-easyui/jquery.easyui.min.js'%}"></script>
<script type="text/javascript" src="{% static 'jquery-easyui/locale/easyui-lang-zh_CN.js' %}"></script>
<script type="text/javascript">
$(function(){
$.messager.confirm('标题内容' , '确认么?' ,function(r){
if(r){
alert('点击确认');
} else {
alert('点击取消');
}
});
$.messager.progress({
title: '我是进度条' ,
msg:'文本内容' ,
text: '正在加载..' ,
interval:1000
});
});
</script>
</html>
index.html
<html>
<body>
<p>home index</p>
</body>
</html>
加载静态文件夹,然后再引用完整的EasyUI引用如下:
编辑autotest/settings.py,添加带背景色内容
INSTALLED_APPS = [
'autotest.apps.AutotestConfig',
……
修改autotest/setting.py
fromdjango.conf.urlsimporturl
fromdjango.conf.urlsimportinclude
fromdjango.contribimportadmin
urlpatterns = [
url(r'^autotest/', include('autotest.urls')),
url(r'^admin/', admin.site.urls),
url(r'^$', include('autotest.urls')),
]
编辑autotest\urls.py
__author__='shouke'
fromdjango.conf.urlsimporturl
from.importviews
urlpatterns = [
url('^testeasyui',views.testeasyui,name='testeasyui')
]
编辑autotest\views.py
from django.shortcuts import render
#from django.http import HttpResponse
def testeasyui(request):
return render(request,'autotest/testeasyui.html')
defindex(request):
returnrender(request,'autotest/index.html')
浏览器访问