我希望为我的客户端代码添加一些结构,并且一直在阅读knockout.js
. 我一直在阅读文档并且有一个简单的问题要问 - 因为淘汰赛需要用户向data-bind
html 元素添加属性,所以它使用表单的最佳方式是什么django
,因为目前我正在使用{{ form.as_p }}
我很好奇我应该如何以及在哪里形成输入view model
(如果它在 Django 的表单字段中,或者没收{{ form.as_p }}
并在 html 中输入。
我希望为我的客户端代码添加一些结构,并且一直在阅读knockout.js
. 我一直在阅读文档并且有一个简单的问题要问 - 因为淘汰赛需要用户向data-bind
html 元素添加属性,所以它使用表单的最佳方式是什么django
,因为目前我正在使用{{ form.as_p }}
我很好奇我应该如何以及在哪里形成输入view model
(如果它在 Django 的表单字段中,或者没收{{ form.as_p }}
并在 html 中输入。
您可以使用小部件将自定义属性添加到表单元定义中的字段。
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
另一种方法是使用django-crispy-formsdata-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 比这更强大,它允许您定义自己的布局模板等。