Django + ajax

标签（空格分隔）：未分类

很多地方要用到ajax，还是要做一下的

我想了一下思路：
比如说，我们就只做一个判断输入用户名的时候，不用刷新，在前端提示该用户是不是在数据库里的功能；
实现方法肯定是，我们写进输入框，然后焦点离开输入框之后，用ajax把输入框的内容传到后台，然后验证之后返回一个状态标识（用户名是否存在数据库的标识）

然后我们就可以写出
首先简单写一个表单做示例

<form action="" method="post">{% csrf_token %}用户名: <input name="username" id="username" /><br><p id="hint"></p><br><input type="submit" value="提交">
</form>

接着是js函数

<script type="text/javascript"
src='{% static 'scripts/jquery-2.2.0.js'%}'>
</script><script>$(document).ready(function(){$("#username").blur(function(){var uname = $("#username").val();$.get("/find",{'username':uname}, function(ret){$('#hint').html(ret);})});});</script>

应该不难理解吧
- blur函数是jQuery的焦点离开的触发函数；
- ‘/find’是我们在Django后台定义的路由，我们在urls.py里如下定义：

from User.views import find
urlpatterns = [# ...其他urlurl(r'^find$', find, name='find'),
]

然后后台实现find函数如下(因为我们这里是通过url传参，函数的参数表并不用定义，访问到这个函数的url格式是‘/find?username=…’)：

def find(request):user_name = request.GET['username']try:user = User.objects.get(user_name = user_name)return HttpResponse("exist")except:return HttpResponse("not exist")

上述几步应该就可以实现功能了

以下的是讲如何将上述功能整合到一个公共模块，然后子页面调用，大家想看就看。

思路：

我们可以把js函数写到check.html（公共模板）里，但是如果这样的话，因为我们的函数是通过前端控件的id来处理动作，那么，我们在继承的时候，所有前端控件的id都必须相同，我们就假设所有用到该功能的输入框为id = ‘username’；

我们写一个check.html放到Django的公共模板(公共的templates文件夹)里：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8">{% block script %}{% load staticfiles %}<script type="text/javascript" src='{% static 'scripts/jquery-2.2.0.js'%}'></script><script>$(document).ready(function(){$("#username").blur(function(){var uname = $("#username").val();$.get("/find",{'username':uname}, function(ret){$('#hint').html(ret);})});});</script>{% endblock%}</head>
<body>{% block body %} body {% endblock %}
</body>
</html>

然后我们的表单的html就是

<!DOCTYPE html>
{% extends "check.html" %}
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title></head>
<body>
{% block body %}<h1>This is test!</h1><form action="" method="post">{% csrf_token %}用户名: <input name="username" id="username" /><br><p id="hint"></p><br><input type="submit" value="提交"></form>{% endblock %}
</body>
</html>

是不是很详细~~

Django + ajax相关推荐

Django Ajax总结
Django Ajax总结 Ajax-Jquery ajax 配合 json 使用BookStrap进行前端框架开发 font-awesome 图标插件 Ajax全套发送请求 1.使用JQuery调 ...
ajax防止csrf,django ajax提交避免csrf_toke错误
将以下代码写入到csrf_token_new.js,然后在html页面中加入该js,即可避免出现csrt错误 /*====================django ajax ======*/jQu ...
django ajax请求 csrf验证失败
如何解决django ajax请求 csrf验证失败的问题: 原文链接:http://stackoverflow.com/questions/5100539/django-csrf-check-fai ...
django ajax 更新表格_Django（反向解析，路由分发、名称空间、视图层、虚拟环境、Django版本、json，CBV）...
https://www.zhihu.com/video/1249117508688711680 每日测验 """ 今日考题 1.列举你知道的orm数据的增删改查方法 2. ...
Django - AJAX
一. JSON 什么是json? json指的是JavaScript对象表示法(JavaScript Object Notation) json是轻量级的文本数据交换格式独立于语言, 支持不同的编程 ...
Django Ajax发送请求使用方法
首先需要引入Jquery这个库其次: 需要引入csrf_token 原因是因为django 表单认证需要csrf认证最后,就是正常执行ajax发送请求示例代码如下: <script src ...
django ajax获取数据类型,Django：使用Ajax获取模板中的数据库对象值
您可以使用AJAX回打电话给你的Django代码,并返回你的车的名称: template.html $(document).ready(function() { $(document).on(&quo ...
Django - Ajax - 参数
一.Jquery实现Ajax url type data success error complete statusCode {% load staticfiles %}<! ...
django ajax 查询,Django分页和Ajax查询
在Django中,实现分页以在多个页面上显示查询项目是非常简单的.使用Ajax仅更新实际发生更改的页面位,而不是每次加载整个页面也是非常直接的.但是,当我们将两者结合在一起时,我发现它有点问题.Dja ...
python django ajax 逻辑推理_python django初识ajax
什么是json json是轻量级文本数据交互格式 json独立语言符合的json对象 ["one", "two", "three"] {& ...

Django + ajax

思路：

Django + ajax相关推荐

最新文章

热门文章