Microsoft. Elemento UI Common.Grid

L'elemento Grid interfaccia utente (UI) mostra una raccolta tabellare di righe. Le righe possono essere aggiunte o modificate aprendo blade che restituiscono i dati delle righe.

Esempio UI

L'elemento Grid genera una tabella con pulsanti comando per aggiungere, modificare ed eliminare righe.

Screenshot del Microsoft. Elemento UI Common.Grid.

Schema

{
  "name": "subnets",
  "type": "Microsoft.Common.Grid",
  "label": {
    "summary": "Subnets",
    "addition": "Add subnet",
    "delete": "Delete subnet",
    "ariaLabel": "Subnets"
  },
  "defaultValue": [
    {
      "name": "default",
      "addressPrefix": "10.0.0.0/24"
    }
  ],
  "addBlade": {
    "name": "SubnetBlade",
    "extension": "Microsoft_Azure_Network",
    "parameters": {},
    "outputItem": "subnet",
    "inContextPane": true
  },
  "editBlade": {
    "name": "SubnetBlade",
    "extension": "Microsoft_Azure_Network",
    "parameters": {
      "subnet": "[$item]"
    },
    "outputItem": "subnet",
    "inContextPane": true
  },
  "constraints": {
    "rows": {
      "count": {
        "min": 1,
        "max": 5
      }
    },
    "canEditRows": true,
    "columns": [
      {
        "id": "name",
        "header": "Name",
        "cellType": "readonly",
        "text": "[$item.name]"
      },
      {
        "id": "addressPrefix",
        "header": "Address prefix",
        "cellType": "readonly",
        "text": "[$item.addressPrefix]"
      }
    ],
    "width": "Full"
  },
  "visible": true
}

Output di esempio

[
  {
    "name": "default",
    "addressPrefix": "10.0.0.0/24"
  }
]

Remarks

  • label.summary viene utilizzato nei riassunti e nei testi di accessibilità.
  • label.addition e label.delete fornire etichette di comando.
  • defaultValue è un array di oggetti riga, o un'espressione che valuta in un array.
  • addBlade definisce la lama aperta per creare una fila. name, parameterse outputItem sono obbligatori.
  • editBlade definisce la lama aperta per modificare una riga esistente. È richiesta quando constraints.canEditRows è true.
  • constraints.rows.count.min e constraints.rows.count.max impostare limiti di conteggio delle righe.
  • constraints.columns definisce le colonne della tabella. Una readonly colonna usa text; una input colonna usa element.
  • constraints.width può essere Small, Mediumo Full.
  • Per i moduli pubblici di template, usa Microsoft.Common.EditableGrid a meno che il tuo host non supporti le lamelle add e edit citate da Microsoft.Common.Grid.

Passaggi successivi

  • Last updated on