开启一个新的应用
./manage.py startapp ajaxtest
 
urls.py中添加

url(r’^ajaxtest/$’,'django.views.generic.simple.direct_to_template’,{‘template’:'ajaxtest/ajaxtest.html’}),    #此处使用了 generic view 所提供的 direct_to_template() 方法可以直接显示一个模板
    url(r’^ajaxtest/input/$’,'ajaxtest.views.input’),    #ajax请求地址
 
修改ajaxtest/views.py
# Create your views here.
 
from django.http import HttpResponse
 
def input(request):
    input = request.POST.get(“input”,None)
    return HttpResponse(‘<p> You input is %s </p>’ %input)
 
创建模版文件templates/ajaxtest/ajaxtest.html,此部分引入了jquery,如果不懂jquery,参考官方
<html>
<head>
<title>Ajax TEST</title>
<script type=”text/javascript” src=”/site_static/jquery-1.7.2.min.js” ></script>
<script type=”text/javascript” src=”/site_static/ajaxtest.js” ></script>
</head>
<body>
<h1>Ajax test</h1>
<form id=”form” method=”post”>
<input type=”text” id=”input” />
<input type=”button” id=”submit” value=”Ajaxsubmit” />
</form>
<div id=”show”></div>
</body>
</html>
 
添加ajaxtest.js文件
$(document).ready(function(){
    $(‘#show’).hide();
    $(‘#submit’).click(function(){
       $.ajax({
           url:’/ajaxtest/input/’,
           type:”POST”,
           data:{input:$(“#input”).val()},
                   dataType:”html”
       }).done(function(msg){
           $(‘#show’).html(msg).show();
       }).fail(function(jqXHR,textStatus){
           alert(“rquest failed” +textStatus);
       });
    });   
});
 
到此我们可以看到基于ajax的处理方法
 
 
标签: ,
本文连接地址: http://www.fresker.com/old2/archives/532 (转载注明出处)

回复

目前暂无评论

Sorry, 评论已关闭.