次のように私は、Djangoのビューを持っているテンプレート

Question

からのデータを使用して動的にDjangoのフォームを埋める：

@login_required(login_url="login/") 
def review(request): 
    table = DummyTable(DummyModel.objects.all())   
    form = DummyForm()   
    return render(request, 'review.html', {'reviews': table, 'DummyForm': form}) 

、これは問題には関係ありませんが、私は、（django-crispy-formあるデフォルトDummyFormを渡しています思考）、私はそれがユーザーがクリックするレコードに応じてそれを設定する必要があります。今

from .models import DummyModel 
from crispy_forms.helper import FormHelper 
from crispy_forms.layout import Layout, Field, ButtonHolder, Submit 
from django.forms import ModelForm 


class DummyForm(ModelForm): 

    class Meta: 
     model = DummyModel 
     fields = ['name', 'description', 'time_points'] 

    def __init__(self, *args, **kwargs): 
     super(DummyForm, self).__init__(*args, **kwargs) 
     self.helper = FormHelper(self) 
     self.helper.form_class = 'form-horizontal' 
     self.helper.label_class = 'col-sm-2' 
     self.helper.field_class = 'col-sm-10' 
     self.helper.layout = Layout(
      Field('name'), 
      Field('description'), 
      Field('time_points'), 
      ButtonHolder(
       Submit('submit', 'Submit', css_class='button white') 
      )) 

、私は、ユーザーが特定のリンクをクリックすると、私は形でレンダリングするレコードの主キーを受信したときに呼び出されるjavascript関数を持っている：フォーム自体はように見えます。現在のところ、それは以下の通りである。

<div id="dialog" class="modal" title="Edit" style="display:none"> 
    <div class="modal-dialog"> 
     <div class="modal-content"> 
     <div class="modal-body"> 
      <!-- Can I pass the primary key variable here??? --> 
      {% crispy DummyForm %} 
     </div> 
     </div> 
    </div> 
    </div> 

私は空のフォームが画面に表示されてい除き、すべてこれが正常に動作します：

この機能をJS

<script> 
     function EditDialog(pk) { 
      // Currently doing nothing with the primary key 
      // Is there a way to initialise the form with data using this key? 
      $("#dialog").modal({width: 500, height: 500}); 
      return false; 
     } 
    </script> 

は、として、フォームを開始します。どのようにJS関数の主キーによって与えられたレコードにフォームをバインドできますか？

通常、ビューで私は、次の操作を行うことができます。

# As an example, just bind to the record with primary key=1 
rec = DummyModel.objects.filter(pk=1).first() 
form = DummyForm(model_to_dict(rec)) 

だから、方法で私は私のテンプレート内の類似した何かをする必要があります。

Answer 1

JSでは、AjaxリクエストをDjangoビューに作成して、値が入力されたフォームを返すことができます。 form.htmlテンプレートがあなたを拡張しません非常に単純なテンプレート、だろう

@login_required(login_url="login/") 
def populate_form(request): 
    pk = request.GET.get('pk') 
    rec = DummyModel.objects.get(pk=pk) 
    form = DummyForm(model_to_dict(rec)) 

    return render(request, 'form.html', {'DummyForm': form}) 

：AJAX要求を処理ビューは次のようになり

<script> 
    function EditDialog(pk) { 
     //ajax request to retrieve the populated form 
     $.ajax({ 
      url: '/url/to/the/view/which/returns/the/populated/form', 
      method: 'GET', 
      data: { 
      pk: pk 
      }, 
      success: function(formHtml){ 
      //place the populated form HTML in the modal body 
      $('.modal-body').html(formHtml); 
      $("#dialog").modal({width: 500, height: 500}); 
      }, 
      dataType: 'html' 
     }); 

     return false; 
    } 
</script> 

：

JSは次のようになります。基本テンプレートのみが含まれます：

{% crispy DummyForm %} 

に注意してください、私はコードを単純にしておけば、populate_formビューでpkの検証を追加し、populate_formへのunauth AJAX呼び出しを処理する必要があります（例えば、長い時間開いているページを持っているユーザーがセッションを終了し、編集ボタンをクリックします）