knockout.jsをdjangoフォームで使用していますか？

Question

クライアントのコードに構造体を追加して、knockout.jsについて読んでいます。私は文書を読んでいて簡単な質問があります。ノックアウトではユーザにdata-bind属性をhtml要素に追加する必要があります。現在使用しているので、フォームを使用する最も良い方法は何ですか？{{ form.as_p }}

は、私は好奇心旺盛ですどこでどのように私はそれはジャンゴでのフォームフィールドである場合（のview modelへの入力を形成し、または{{ form.as_p }}を放棄し、代わりにHTML内で入力する必要があります。

は

Answer 1

カスタムがであなたのフィールドに属性を追加することができますウィジェットによるフォームのメタ定義。

class SomeForm(forms.ModelForm): 
    class Meta: 
     model = SomeModel 
     widgets = {'field_name1': forms.Textarea(attrs={'data-bind':'value: field1'}), 
        'field_name2': forms.TextInput(attrs={'data-bind':'value: field2'})} 

は、例えば、最初のフィールドがレンダリングされます：

<textarea id="id_field_name1" name="field_name1" data-bind="value: field1"></textarea> 

更新：彼らはすべてが必要な場合は、ここにボーナスとして は、フォーム内のすべてのフィールドの属性を変更する簡単な方法は、例えば、特定のクラス（jsの他のアドオンやCSSスタイルに役立つ）

def __init__(self, *args, **kwargs): 
     super(SomeForm, self).__init__(*args, **kwargs) 
     for name, field in self.fields.items(): 
      field.widget.attrs['class'] = 'some_form_field' 
      # this could be used in your case if the Django field name is the 
      # same as the KO.js field name 
      field.widget.attrs['data-bind'] = 'value: %s' % name 

Answer 2

もう一つの方法は、django-crispy-formsを使用してlayoutでdata-bind属性を定義することです。

def __init__(self, *args, **kwargs): 
    super(SomeForm, self).__init__(*args, **kwargs) 
    self.helper = FormHelper() 
    self.helper.layout = Layout(
     Div('field_1', 
      Field('field_2', data_bind='value: field_2')), 
     HTML("{% if success %} <p data-bind="css: { success: success_flag }">Operation was successful</p> {% endif %}"), 
    ) 

次にテンプレートであなただけの操作を行います。

{% crispy form form.helper %} 

と出来上がりを。

Cripsy-formsはそれよりもさらに強力であり、自分でlayout templatesなどを定義することができます。