如何提交表单而不使用Django，Ajax，jQuery刷新页面？

我是新手与Django合作。我需要简单的例子。如何使用Django，Ajax，jQuery提交表单（post）而无需刷新页面？如何提交表单而不使用Django，Ajax，jQuery刷新页面？

这是我的表，视图和模板：（使用 “的ModelForm” 形式）

from django import forms 
from django.forms import ModelForm 
from linki.models import Advert 


class AdvertForm(ModelForm): 
    class Meta: 
     model = Advert

模板（形式的html代码）

views.py

from django.shortcuts import * 
from django.template import RequestContext 
from linki.forms import * 

def advert(request): 
    if request.method == "POST": 
     form = AdvertForm(request.POST) 

     if(form.is_valid()): 
      print(request.POST['title']) 
      message = request.POST['title'] 

     else: 
      message = 'something wrong!' 


     return render_to_response('contact/advert.html', 
       {'message':message}, 
      context_instance=RequestContext(request)) 

    else: 
     return render_to_response('contact/advert.html', 
       {'form':AdvertForm()}, 
      context_instance=RequestContext(request))

forms.py

<html> 
<head> 

</head> 
    <body> 
    <h1>Leave a Suggestion Here</h1> 
     {% if message %} 
      {{ message }} 
     {% endif %} 
     <div> 
      <form action="" method="post">{% csrf_token %} 
       {{ form.as_p }} 
       <input type="submit" value="Submit Feedback" /> 
      </form> 
     </div> 
    </body> 
</html>

来源

2012-07-25 webfanks

，如果你打算使用一个Ajax使用jQuery你不应该从您的视图返回HTML提交..我建议你这样做，而不是：

HTML：

<html> 
<head> 
</head> 
<body> 
    <h1>Leave a Suggestion Here</h1> 
     <div class="message"></div> 
     <div> 
      <form action="" method="post">{% csrf_token %} 
       {{ form.as_p }} 
       <input type="submit" value="Submit Feedback" /> 
      </form> 
     </div> 
</body> 
</html>

的JS

$('#form').submit(function(e){ 
    $.post('/url/', $(this).serialize(), function(data){ ... 
     $('.message').html(data.message); 
     // of course you can do something more fancy with your respone 
    }); 
    e.preventDefault(); 
});

的views.py

import json 
from django.shortcuts import * 
from django.template import RequestContext 
from linki.forms import * 

def advert(request): 
    if request.method == "POST": 
     form = AdvertForm(request.POST) 

     message = 'something wrong!' 
     if(form.is_valid()): 
      print(request.POST['title']) 
      message = request.POST['title'] 

     return HttpResponse(json.dumps({'message': message})) 

    return render_to_response('contact/advert.html', 
      {'form':AdvertForm()}, RequestContext(request))

这样你就把这个响应放在message div中。而不是返回纯html，你应该返回json。

来源

2012-07-27 04:59:23 pahko

data.message在JS部分应该是JSON.parse（data）.message – rawbeans 2014-07-03 22:55:34

$('#form-id').submit(function(e){ 
    $.post('your/url', $(this).serialize(), function(e){ ... }); 
    e.preventDefault(); 
});

来源

2012-07-25 10:32:36

<script type="text/javascript"> 
$(document).ready(function() { 
    $('#form_id').submit(function() { // catch the form's submit event 
     $.ajax({ // create an AJAX call... 
      data: $(this).serialize(), // get the form data 
      type: $(this).attr('method'), // GET or POST 
      url: $(this).attr('action'), // the file to call 
      success: function(response) { // on success.. 
       $('#success_div).html(response); // update the DIV 
      }, 
      error: function(e, x, r) { // on error.. 
       $('#error_div).html(e); // update the DIV 
      } 
     }); 
     return false; 
    }); 
}); 
</script>

来源

2012-07-27 05:50:41

如何提交表单而不使用Django，Ajax，jQuery刷新页面？

回答

相关问题