javascript - 使用 jquery 和骨干 js 创建动态表单字段

Question

我有一个使用主干 js 和 jquery 的应用程序。我需要根据从服务器获得的响应动态生成模板。场景是这样的......我有一个可以选择的模板下拉列表，在我从下拉列表中选择任何模板后，会为该模板调用一个 api，它为我提供了这样的结构

items:[
{
    "vars":
           {
               "name":
                      {
                           "required": false,
                           "default": "abc"
                      },
               "address":
                      {
                           "required": false,
                           "default": "xyz"
                       }
           }
    "tables": {}
}]

那么如何使用这种服务器响应创建动态表单元素呢？

Answer 1

您可以使用主干表单插件，并将服务器响应映射到表单对象。就像是：

var data = {};
var schema = {};
var item = _.first(items);

_.each(item.vars, function(value, key) {
  data[key] = value.default;
  schema[key] = {
    type:"Text",
    validators:value.required ? ['required'] : undefined
  };
});

var form = new Backbone.Form({data:data, schema:schema}).render();

这只是一个简单的、未经测试的示例。查看backbone-forms文档，看看它是否可以满足您的需求。