羊驼 - 当架构对象是数组类型时,如何设置布局模板?

时间:2018-02-14 10:44:56

标签: javascript json jsonschema alpacajs


有没有办法在架构内为数组列表对象设置View模板?

我找到了关于布局的the Documentation,但它在我的情况下不起作用,因为我的架构只包含一个内部有多个字段的对象数组。在页面加载时我没有收到任何错误,我的羊驼对象包含我添加的模板而没有记录。



var Schema = {
  "title": "Lista controlli",
  "type": "array",
  "items": {
    "type": "object",
    "title": "Controllo Lavorazione",
    "properties": {
      "Id": {
        "title": "Id",
        "type": "string"
      },
      "Tipo": {
        "title": "Tipo controllo",
        "type": "number",
        "required": true,
        "enum": [1, 2, 3, 4]
      },
      "Obbligatorio": {
        "required": true
      },
      "Nome": {
        "title": "Nome",
        "type": "string",
        "required": true
      },
      "Sigla": {
        "title": "Sigla",
        "type": "string",
        "required": true
      },
      "Posizione": {
        "title": "Posizione",
        "type": "number"
      },
      "Valore": {
        "title": "Valore",
        "type": "number",
        "required": true
      },
      "UM": {
        "title": "Unita Misura",
        "type": "string"
      },
      "TolleranzaMeno": {
        "title": "Tolleranza (-)",
        "type": "number",
        "required": true
      },
      "TolleranzaPiu": {
        "title": "Tolleranza (+)",
        "type": "number",
        "required": true
      },
      "Lettura": {
        "title": "Valore letto",
        "type": "string"
      }
    }
  }
}

var Lavorazioni_Options = {
  "type": "array",
  "toolbarSticky": true,
  "items": {
    "type": "object",
    "fields": {
      "Id": {
        "hidden": true
      },
      "Tipo": {
        "type": "select",
        "sort": function(a, b) {
          if (a.value > b.value) {
            return 1;
          } else if (a.value < b.value) {
            return -1;
          }
          return 0;
        },
        "noneLabel": "-- Seleziona --",
        "removeDefaultNone": false,
        "showMessages": false,
        "optionLabels": ["Numerico", "Testo", "Flag", "Nota"]
      },
      "Obbligatorio": {
        "rightLabel": "Controllo Obbligatorio",
        "type": "checkbox"
      },
      "Posizione": {
        "showMessages": false,
        "hidden": true
      },
      "Nome": {
        "showMessages": false
      },
      "Sigla": {
        "showMessages": false
      },
      "Valore": {
        "hidden": true
      },
      "TolleranzaPiu": {
        "hidden": true
      },
      "TolleranzaMeno": {
        "hidden": true
      },
      "UM": {
        "hidden": true
      },
      "Lettura": {
        "hidden": true
      }
    }
  },
  "focus": false,
  "helpers": [],
  "validate": true,
  "disabled": false,
  "showMessages": false,
  "legendStyle": "button",
  "hideInitValidationError": true
}

var LavorazioniEdit_Options = {
  "type": "array",
  "toolbarSticky": true,
  "items": {
    "type": "object",
    "fields": {
      "Id": {
        "disabled": true
      },
      "Tipo": {
        "type": "select",
        "sort": function(a, b) {
          if (a.value > b.value) {
            return 1;
          } else if (a.value < b.value) {
            return -1;
          }
          return 0;
        },
        "noneLabel": "-- Seleziona --",
        "removeDefaultNone": false,
        "showMessages": false,
        "optionLabels": ["Numerico", "Testo", "Flag", "Nota"]
      },
      "Obbligatorio": {
        "rightLabel": "Controllo Obbligatorio",
        "type": "checkbox"
      },
      "Posizione": {
        "showMessages": false,
        "hidden": true
      },
      "Nome": {
        "showMessages": false
      },
      "Sigla": {
        "showMessages": false
      },
      "Valore": {
        "hidden": true
      },
      "TolleranzaPiu": {
        "hidden": true
      },
      "TolleranzaMeno": {
        "hidden": true
      },
      "UM": {
        "hidden": true
      },
      "Lettura": {
        "hidden": true
      }
    }
  },
  "focus": false,
  "helpers": [],
  "validate": true,
  "disabled": false,
  "showMessages": false,
  "legendStyle": "button",
  "hideInitValidationError": true
}

var LavorazioniArticoli_Options = {
  "type": "array",
  "toolbarSticky": true,
  "items": {
    "type": "object",
    "fields": {
      "Id": {
        "hidden": true
      },
      "Tipo": {
        "type": "select",
        "disabled": true,
        "sort": function(a, b) {
          if (a.value > b.value) {
            return 1;
          } else if (a.value < b.value) {
            return -1;
          }
          return 0;
        },
        "noneLabel": "-- Seleziona --",
        "removeDefaultNone": false,
        "showMessages": false,
        "optionLabels": ["Numerico", "Testo", "Flag", "Nota"]
      },
      "Obbligatorio": {
        "rightLabel": "Controllo Obbligatorio",
        "disabled": true,
        "type": "checkbox"
      },
      "Posizione": {
        "showMessages": false,
        "hidden": true
      },
      "Nome": {
        "showMessages": false,
        "disabled": true
      },
      "Sigla": {
        "showMessages": false
      },
      "Valore": {
        "multipleOf": 0.01,
        "showMessages": false
      },
      "TolleranzaPiu": {
        "multipleOf": 0.01,
        "showMessages": false
      },
      "TolleranzaMeno": {
        "multipleOf": 0.01,
        "showMessages": false
      },
      "UM": {},
      "Lettura": {
        "hidden": true
      }
    }
  },
  "focus": false,
  "helpers": [],
  "validate": true,
  "disabled": false,
  "showMessages": false,
  "legendStyle": "button",
  "hideInitValidationError": true
}

var lavorazioniView = {
  "parent": "bootstrap-edit-horizontal",
  "layout": {
    "template": "<div class='row'><div class='col-md-6' id='column-1'></div><div class='col-md-6' id='column-2'></div></div>",
    "bindings": {
      "Id": "column-1",
      "Posizione": "column-2",
      "Tipo": "column-1",
      "Obbligatorio": "column-2",
      "Nome": "column-1",
      "Sigla": "column-2",
      "Valore": "column-1",
      "UM": "column-2",
      "TolleranzaMeno": "column-1",
      "TolleranzaPiu": "column-2",
      "Lettura": "column-1"
    }
  }
}

$(function() {
  $('#jsoneditor').alpaca({
    "schema": Schema,
    "options": Lavorazioni_Options,
    //"view": lavorazioniView
  });
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.0.0/handlebars.js"></script>
<script src="https://code.cloudcms.com/alpaca/1.5.23/bootstrap/alpaca.min.js"></script>
<link href="https://code.cloudcms.com/alpaca/1.5.23/bootstrap/alpaca.min.css" rel="stylesheet" />

<div id="jsoneditor" class="jsoneditor-wrapper"></div>
&#13;
&#13;
&#13;

提前致谢

1 个答案:

答案 0 :(得分:1)

看起来目前这是不可能的。 羊驼回购有一个悬而未决的问题。

https://github.com/gitana/alpaca/issues/549

&#34;布局绑定仅适用于顶级架构元素,但不适用于子元素。&#34;

对不起,如果这会破坏你的一天(就像我的那样)。