Microsoft. Common.Grid UI-Element

Das Grid Benutzeroberflächenelement (UI) zeigt eine tabellarische Sammlung von Zeilen an. Reihen können hinzugefügt oder bearbeitet werden, indem Blades geöffnet werden, die Zeilendaten zurückgeben.

UI-Beispiel

Das Element Grid rendert eine Tabelle mit Befehlstasten zum Hinzufügen, Bearbeiten und Löschen von Zeilen.

Screenshot von Microsoft. Common.Grid UI-Element.

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
}

Beispielausgabe

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

Remarks

  • label.summary wird in Zusammenfassungen und Barrierefreiheitstexten verwendet.
  • label.addition und label.delete Befehlsbezeichnungen bereitzustellen.
  • defaultValue ist ein Array von Zeilenobjekten oder ein Ausdruck, der auf ein Array ausgewertet wird.
  • addBlade definiert die Klinge, die geöffnet wird, um eine Reihe zu bilden. name, parametersund outputItem sind erforderlich.
  • editBlade definiert die Blade, die geöffnet wird, um eine bestehende Zeile zu bearbeiten. Es ist erforderlich, wenn constraints.canEditRows .true
  • constraints.rows.count.min und constraints.rows.count.max Reihenanzahllimits festzulegen.
  • constraints.columns definiert die Tabellenspalten. Eine Spalte verwendet text; eine input Spalte readonly verwendet element.
  • constraints.width kann Small, Medium oder Full sein.
  • Für öffentliche Vorlagen-Spezifikationsformulare verwenden Microsoft.Common.EditableGrid , es sei denn, dein Host unterstützt die von Hinzufügen und Bearbeiten referenzierten Blades Microsoft.Common.Grid.

Nächste Schritte