Django+Ajax+jQuery实现网页动态更新的实例
作者:EthanSheng 发布时间:2023-02-11 03:23:19
标签:Django,动态,更新
views.py中的修改
增加相应的请求处理函数:
def getdevjson(request):
print 'get here'
if ('key' in request.GET):
searchkey = request.GET.get('key')
return JsonResponse(search(searchkey))
else:
return HttpResponse('Sorry!')
返回字符串中,既可以使用from django.http import JsonResponse,也可以使用HttpResponse(json.dumps(res))
前端网页修改
<script type="text/javascript">
window.jQuery || document.write("<script src='../static/js/jquery.min.js'>" + "<" + "/script>");
</script>
<script type="text/javascript">
$(function() {
var submit_form = function(e) {
$.ajax({
type : "GET",
url : "/getdevjson?"+Math.random(),
data : {
key: $('#searchContent').val()
},
dataType : "text",
success : function(res){
$('#searchContent').focus().select();
//console.log(res);
update(res);
},
error : function() {
alert("处理异常返回!");}
});
return false;
};
$('#calculate').bind('click', submit_form);
$('input[type=text]').bind('keydown', function(e) {
if (e.keyCode == 13) {
submit_form(e);
}
});
$('#searchContent').focus();
});
</script>
<div class="divRight" id="divright1">
<div class="divRight" style="height:70px; width:370px;">
<label id="lblSearch" class="cssLabelSearch">请输入查询key:</label>
<input id="searchContent" type="text" size="40"></input>
<input id="calculate" type="button" value="确定" ></input>
</div>
<br>
<label id="lbl1" class="cssLabelClient">节点信息</label>
<Textarea id="ClientInfoArea" readonly class="txtClientInfo"></Textarea>
</div>
#calculate是一个按钮,点击动作绑定了提交函数submit_form,ajax的请求参数中,data中包含了查询参数,success是请求成功后的动作,注意返回的res需要进行json解析才可以正确使用:root = JSON.parse(jsondata);update(res)是一个更新网页内容的函数
路由配置修改
urls.py中修改如下:
from django.conf.urls import patterns, include, url
from django.contrib import admin
admin.autodiscover()
urlpatterns = patterns('',
url(r'^getdevjson$','dev.views.getdevjson',name='getdevjson'),
url(r'^','dev.views.index',name='index'),
url(r'^admin/', include(admin.site.urls)),
)
需要注意的是为了避免路由被覆盖,将index的路由配置尽量放置在最后一行。
来源:https://blog.csdn.net/wushanyun1989/article/details/54928281
0
投稿
猜你喜欢
- #!/usr/bin/python# -*- coding: utf-8 -*-class TreeNode(object): &
- WEB标准,从我大二开始接触到毕业后的第一份工作“页面重构工程师”,从接触标准到蓝色理想标准区版主的四年多时间里,WEB标准已经成为我生活中
- 1 Support Vector Machines1.1 Example Dataset 1%matplotlib inlineimport
- Turtle图形库Turtle 库是 Python 内置的图形化模块,属于标准库之一,位于 Python 安装目录的 lib 文件夹下,常用
- ASP中查询数据库记录写入XML文件示例,把下面代码保存为Asp_XML.asp运行即可: &
- 本文实例讲述了python服务器与android客户端socket通信的方法。分享给大家供大家参考。具体实现方法如下:首先,服务器端使用py
- 1.如何让计算机自动判断一张图是否偏暗?或是判断一张图是否是处于夜晚?我们可以先把图片转换为灰度图,然后根据灰度值的分布来判断,如:我们可以
- 我和朋友都建了一个电子商务网站,大量的访问,频繁地建立和中断数据库连接,导致Web 数据库应用程序降低了数据库服务器的性能。但最近,朋友使用
- 本文实例讲述了python实现web方式logview的方法。分享给大家供大家参考。具体如下:这里用Python实现web方式查看日志的一个
- 本文实例讲述了Python简单读写Xls格式文档的方法。分享给大家供大家参考,具体如下:1. 模块安装使用pip install命令安装,即
- 本文实例为大家分享了js实现黑白div块画空心图形的具体代码,供大家参考,具体内容如下<!DOCTYPE html><ht
- 如何用通过Web访问OLAP数据? <% Set Conn=Server.CreateObject(″A
- 本文实例讲述了Python实现的数据结构与算法之基本搜索。分享给大家供大家参考。具体分析如下:一、顺序搜索顺序搜索 是最简单直观的搜索方法:
- 在Python语言中,Uincode字符串处理一直是一个容易让人迷惑的问题。许多Python爱好者经常因为搞不清Unicode、UTF-8还
- 对Python中列表和数组的赋值,浅拷贝和深拷贝的实例讲解列表赋值:>>> a = [1, 2, 3]>>&g
- 内容摘要:通常的,ASP中表单提交的数据一般被写入数据库。然而,如果你想让发送数据更为简便易行,那么,可以将它书写为XML文件格式。这种方式
- 1.阈值化分割原理通过对图像的灰度直方图进行数学统计,选择一个或多个阈值将像素划分为若干类。一般情况下,当图像由灰度值相差较大的目标和背景组
- 本文实例讲述了python解析xml的方法。分享给大家供大家参考,具体如下:xml是除了json之外另外一个比较常用的用来做为数据交换的载体
- numpy对数组求平均时忽略nan值在对numpy数组求平均np.mean()或者求数组中最大最小值np.max()/np.min()时,如
- 在学习接口测试的时候往往会因为没有实际操作的接口进行测试而烦恼,这里教大家自己编写两个接口用于学习接口测试1、编写一个登录的接口2、在pyc