在羊驼 object 上添加数组类型和 select 类型

Question

I have this alpaca page https://jsfiddle.net/knh9yrje/ with the following schema

$(document).ready(function() {
let form = {
  "view": "bootstrap-edit",
   "data": {
        name: "John Matrix",
        age: 40,
        ice: ["Vanilla", "Chocolate"],
        items: [{
        "flavor": "strawberry",
        "topping": "nuts"
        }, {
            "flavor": "chocolate",
            "topping": "raisin"
        }]
    },
    
  "schema": {
    "type": "object",
    "properties": {
    "items": {
            "title": "Ice Cream",
            "type": "array",
            "properties": {
                "flavor": {
                    "title": "Flavor",
                    "description": "Ice cream flavor",
                    "type": "string"
                },
                "topping": {
                    "title": "Topping",
                    "description": "Ice cream topping",
                    "type": "string"
                }
            }
        },
    "ice": {
        "title": "Ice cream",
        "helper": "Guess my favorite ice cream?",
        "type": "select",
        "multiple": true,
        "dataSource": "http://localhost:8000/data_routes/icecream_list"
    },
    "name": {
        "title": "Full Name",
        "type": "string"
         },
    "age": {
        "title": "Age",
        "type": "number"
     },
            
      "description_required": {
        "enum": [
          "Y",
          "N"
        ],
        "required": true
      },
      "description": {
        "required": true
      }
    },
    "dependencies": {
      "description": ["description_required"] 
    }
  },
  "options": {
    "fields": {
      "description_required": {
        "type": "select",
        "noneLabel": "Select an Option",
        "label": "Description Required"
      },
      "description": {
        "type": "textarea",
        "cols": 5,
        "label": "Description",
        "dependencies": {
          "description_required": "Y" 
        }
      }
    }
  }
}

$("#form").alpaca(form);
});

In it i want to have an array type and a select box that fetches data remotely. The remote data is of this format

{
    "data": {
        "Vanilla": "Vanilla Flavor",
        "Chocolate": "Chocolate Flavor",
        "Strawberry": "Strawberry Flavor",
        "Mint": "Mint Flavor"
    }
}

I get error

{"message":"Unable to find field class for type: undefined","reason":"FIELD_INSTANTIATION_ERROR"}

How can i fix this?

Answer 1

I solved it like this

$(document).ready(function() {
let form = {
  "view": "bootstrap-edit",
   "data": {
        name: "John Matrix",
        age: 40,
        ice: ["Vanilla", "Chocolate"],
        items: [{
        "flavor": "strawberry",
        "topping": "nuts"
        }, {
            "flavor": "chocolate",
            "topping": "raisin"
        }]
    },
    
  "schema": {
    "type": "object",
    "properties": {
    "items": {
            "title": "Ice Cream",
            "type": "array",
            "properties": {
                "flavor": {
                    "title": "Flavor",
                    "description": "Ice cream flavor",
                    "type": "string"
                },
                "topping": {
                    "title": "Topping",
                    "description": "Ice cream topping",
                    "type": "string"
                }
            }
        },
    
    "name": {
        "title": "Full Name",
        "type": "string"
         },
    "age": {
        "title": "Age",
        "type": "number"
     },
    "ice": {
        "title": "Ice",
        "type": "select"
     },
            
      "description_required": {
        "enum": [
          "Y",
          "N"
        ],
        "required": true
      },
      "description": {
        "required": true
      }
    },
    "dependencies": {
      "description": ["description_required"] 
    }
  },
  "options": {
    "fields": {
    "ice": {
        "title": "Ice cream",
        "helper": "Guess my favorite ice cream?",
        "type": "select",
        "multiple": false,
        "dataSource": "http://localhost:8000/data_routes/icecreal_list"
    },
      "description_required": {
        "type": "select",
        "noneLabel": "Select an Option",
        "label": "Description Required"
      },
      "description": {
        "type": "textarea",
        "cols": 5,
        "label": "Description",
        "dependencies": {
          "description_required": "Y" 
        }
      }
    }
  }
}

$("#form").alpaca(form);
});