Django、Ajax、jQueryを使用してページを更新せずにフォームを送信するには？

私はdjangoで働いている初心者です。私は単純な例が必要です。 Django、Ajax、jQueryを使用してページを更新せずにフォーム（投稿）を送信するには？Django、Ajax、jQueryを使用してページを更新せずにフォームを送信するには？

これは私のフォーム、ビュー、およびテンプレートです：

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（ "のModelForm" を使用してフォーム）

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


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

テンプレート（フォームのHTMLコード）

<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

あなたがあなたのビューからHTMLを返すべきではありませんjQueryを使って提出するAJAXを使用することを計画している場合..私の代わりにこれを行うには、あなたを提案する：

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>

$('#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

JSセクションのdata.messageはJSON.parse（data）.messageである必要があります。 – rawbeans

$('#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を使用してページを更新せずにフォームを送信するには？

答えて

関連する問題