Django(二)

1、Ajax請求

get方式

for表單

<form action="/add/" method="get">
        a: <input type="text" id="a" name="a"><br>
        b: <input type="text" name="b" id="b"><br>
        <p>result: <span id="result"></span></p>
        <button type="button" id="sum">提交</button>
    </form>

click事件

$("#sum").click(function(){
        var a = $("#a").val();
        var b = $("#b").val();

        $.get("/add/",{'a':a,'b':b}, function(ret){
            $('#result').html(ret);
        })
    })

或者

$.ajax({
                type:"get",
                url:"{% url  'add'%}",
                data:{'a':a,'b':b},
                success:function (result) {
                     $('#result').html(result);
                }
            })

view處理事件

def add(request):
    a =request.GET.get('a')
    b = request.GET.get('b')
    print(a,b)
    return HttpResponse(int(a)+int(b))

post方式

如果不註釋中間件MIDDLEWARE中的'django.middleware.csrf.CsrfViewMiddleware',需要使用下面的方法

form表單

<form id="mult" method="post">
        {% csrf_token %}
        a: <input type="text" id="num1"><br>
        b: <input type="text" id="num2"><br>
        <p>result: <span id="product"></span></p>
        <button type="submit" id="ji">提交</button>
    </form>

click事件

 $(document).ready(function() {
        $.ajaxSetup({
            data:{csrfmiddlewaretoken:'{{ csrf_token}}'},
        });

        $('#ji').click(function() {
            var num1 =$('#num1').val();
            var num2 =$('#num2').val();
            console.log(num1,num2)
            $.ajax({
                type:'POST',
                data:{num1:num1,num2:num2},
                url:"{%url 'mulit'%}",
                cache:false,
                dataType:'html',
                success:function (result) {
                    console.log(result)
                    $('#product').html(result)
                },
            return false
        });
        });

views時間處理


@csrf_protect
def mulit(request):
    if request.method=="POST":
        num1 = request.POST['num1']
        num2 = request.POST['num2']
        num = int(num1)*int(num2)
        print(num1,num2)
        return HttpResponse(num)
    else:
        return HttpResponse('<h1>error</h1>')

(於2016年11月24日,http://blog.csdn.net/bzd_111

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章