我正在backbone.js 中开发一个单页应用程序,它使用大量html 表单来收集用户输入。 为了节省编码时间,我想要一个类似于 Django's Form fields 的 FormField 模型/集合
我的要求:
- 表单元素及其行为的声明性规范(例如所需的真/假、事件……)
- 所有表单字段的默认 View /模板(但可通过配置覆盖)
- 属于表单的所有字段都应存储在一个 Backbone.Collection 中,以便于字段检索
- 验证整个表单或单个元素
这是我的简单表单字段实现的样子:
FormField = Backbone.Model.extend({
initialize: function (attributes, options){
//TODO: initialize form field according to type,
// i.e. set up correct view, validation etc.
}
defaults: {
type: "TextField",
label: "Unknown Label",
required: false,
}
});
FormFields = Backbone.Collection.extend({model: FormField})
MyPlugin = new PluginModel({
//TODO: render a form with these config options within the edit view of the PluginModel
config: FormFields([
{type: "TextField", id:"store_name", label: "Name of Store", required: true},
{type: "SelectField", id:"store_type", label: "Type of Store", required: true, choices: ['local','http']},
]),
//runs after user "submits" form
run: function (){
if this.config.isValid(){
}
}
});
但是,我遇到了以下问题:
Backbone.Collection
只能托管相同类型的模型。在一个集合中存储不同表单字段的最佳方法是什么? (我的方法是仅使用一个FormField
类,所有区分都基于initialize() 方法中的 formfield 类型进行,但这对我来说似乎有点困惑)- 如何为每个 FormField 实例设置正确的 View ?
最佳答案
并没有真正发现使用模型来决定 UI 元素...
保持模型干净。仅通过后端进出应用程序的数据。您的验证存在于您的模型中(有关验证方法,请参阅主干文档)。您的模型包含将在 View 中显示的所有字段。
现在您需要有关这些字段(您称之为 FormFields)的信息。它们不需要是主干模型,也不需要插入到主干集合中。一个简单的 JavaScript 对象和数组就足够了。在扩展模型时将此信息添加到模型中(字段描述数组)。
从模型实例化通用表单 View 并使用字段描述创建表单。监听输入、选择、文本区域的更改事件并更新模型。如果出现验证错误,模型上将触发“错误”事件,您可以在 View 上使用react(显示错误)。
关于javascript - 如何向 Backbone 应用程序添加类似 django 的 Formfields?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5618602/