2016-09-02 8 views
1

Django 1.10。私はajaxを/ editから取得できますが、/ detailからは使用できません

From DetailView私はajaxを介してモデルオブジェクトを更新したいと考えています。モデルオブジェクトは更新されています。しかし、ajaxの成功関数はpostメソッドからデータを取得できません。私は失敗機能で発生します。

つまり、UpdateViewのDjangoでは、form_validのブレークポイントで停止し、コード200のHttpResponseを返すように制御できます。また、詳細情報のページを更新すると、モデルオブジェクトが変更されたことがわかります。

しかし、デバッグ中のChrome開発ツールでは、jsが失敗することがあります。そして、jqXHR.status = 0、textStatus = "エラー"、errorThrown = ""。

私は私の本当の状況のシミュレーションを用意しています https://[email protected]/Kifsif/ajax_update.git

は違いがあります:このUpdateViewはgeneral_detail.htmlをレンダリングします。実際には、partial_detail.htmlをレンダリングする必要があります。まあ、それはアヤックスなので、ページ全体をリロードする必要はありません。

したがって、このシミュレーションはページ全体をレンダリングします。どういう意味ですか?つまり、

1)私がhttp://localhost:8000/1/detailにいる場合は、AjaxEditリンクを押すとエラーになります。働いていない。 Chromeデベロッパーツールでは、私は失敗機能で発生します。

2)http://localhost:8000/1/detailに戻り、[編集]を押します。私はhttp://localhost:8000/1/editで発生します。これはajaxのない普通の編集です。しかし、この見方は、リダイレクトなしで応答を出すように編成されています。だから、私はモデルを保存し、http://localhost:8000/1/editにとどまります。あたかもDetailViewの結果を見ているかのように、全体の詳細を見ることができます。コントロールリンクには、EditとAjaxEditという2つのリンクがあります。 これでAjaxEditが動作を開始します。

つまり、http://localhost:8000/1/editでは、ajaxが動作します。http://localhost:8000/1/detailではありません。

私はちょうどajaxの学習を始めました。私はこれに対処できません。私はリダイレクトが影響を与えるかもしれないと言います。しかし、リダイレクトはありません。

経由で私はビューのgetメソッドにアドレスし、適切なデータを取得します。投稿との違いは何ですか?

あなたはそれにコメントして、私が突破するのを助けてくれますか?

views.py

class GeneralUpdate(UpdateView): 
    model = General 
    fields = ['char'] 

    def form_valid(self, form): 
     self.object = form.save() 
     return render(self.request, 'general/general_detail.html', {"object": self.object}) 

models.py

class General(models.Model): 
    char = models.CharField(max_length=100) 

    def get_absolute_url(self): 
     return reverse("detail", kwargs={"pk": self.id}) 

urls.py

urlpatterns = [ 
    url(r'^admin/', admin.site.urls), 
    url(r'^create$', GeneralCreate.as_view(), name="create"), 
    url(r'^(?P<pk>\d+)/detail$', GeneralDetailView.as_view(), name="detail"), 
    url(r'^(?P<pk>\d+)/edit$', GeneralUpdate.as_view(), name="edit"), 
] 

general_form.html

<form id="form" action="" method="post">{% csrf_token %} 
    {{ form.as_p }} 
    <input id="submit" type="submit" value="Save" /> 
</form> 

general_detail。HTML

<p id="char">{{ object.char }}</p> 

<a href="{% url "edit" object.id %}">Edit</a> 
<a id="ajax_edit" href="javascript:void(0)">AjaxEdit</a> 


<script src="https://code.jquery.com/jquery-3.1.0.min.js" integrity="sha256-cCueBR6CsyA4/9szpPfrX3s49M9vUU5BgtiJj06wt/s=" crossorigin="anonymous"></script> 
<script> 
    $(document).ready(function() { 
    var ajax_edit = $("#ajax_edit"); 
    var char = $("#char"); 

    function show_get(data){ 
     $(data).insertAfter(char); 
     var submit_link = $("#submit"); 
     submit_link.click(post); 
    } 

    function show_post(data){ 
     debugger; 
    } 

    function failure(jqXHR, textStatus, errorThrown){ 
     debugger; 
    } 

    function post(){ 
     $.ajax({ 
       method: "post", 
       data: $("form").serialize(), 
       url: 'http://localhost:8000/2/edit', 
       success: show_post, 
       error: failure, 
       } 
     ) 
    } 

    function get(){ 
     $.ajax({ 
       method: "get", 
       url: 'http://localhost:8000/2/edit', 
       success: show_get, 
       } 
     ) 
    } 

    ajax_edit.click(get); 

    }); 
</script> 

答えて

0

私はそれを正しく理解していれば...

  1. あなたはAjaxEditをクリックします - それは直接あなたの/detailページにそれをUpdateViewから応答をフェッチし、ロードします。あなたは技術的にまだdetailページにいます。
  2. あなたのフォームをchrome devでチェックし、そのフォームactionに何も触れていないことを確認してください。
  3. Saveをクリックすると、ajaxリクエストによってデータが計画どおりに更新されます。
  4. デフォルトの送信が行われ、技術的にまだdetails pageになっているので、POSTリクエストは/detailというURLに送られます。
  5. DjangoのDetailViewPOSTのリクエストを禁止し、405 HTTPステータス(Method not Allowed)でリクエストし、Chromeのインスペクタでチェックします。

これが主な理由です。デフォルト無効にすることができます修正として

はどうもありがとうございましsubmit_link.click(post);

+0

$("#form").submit(function(event){ event.preventDefault(); }); 

を追加することで、アクションを提出します。素晴らしい答え。 – Michael

関連する問題