How to Display a Grid in a Windows Azure Pack Management Portal Extension (Jak wyświetlić siatkę w rozszerzeniu portalu zarządzania pakietu azure)

 

Dotyczy: Windows Azure Pack

Siatka to podstawowy sposób wyświetlania listy danych użytkownikowi. Ma obsługę wielokrotnego wybierania, zmieniania kolejności i sortowania kolumn, wyświetlania ikon i tekstu oraz automatycznego odświeżania ze zdefiniowanego źródła danych. Typowy wzorzec jest przeznaczony dla rozszerzenia, aby pokazać siatkę, gdy użytkownik wybierze kartę.

Aby wyświetlić siatkę, gdy użytkownik wybierze kartę

1. Umieść następujący kod siatki w otwartej funkcji dla karty:

   // This function has been set to be the opened function earlier
   // For this to work, there should be a <div> in your template for the tab with a class of "gridContainer"
   function loadTab(extension, renderArea, initData) {
     // Create a dataset so the client-side framework knows how to get the data for refreshes
     var localDataSet = Exp.Data.getLocalDataSet(DomainTenantExtension.Controller.listOwnedDomainNamesUrl),
     // Define the columns in the grid. A number of pre-defined types exist.
     columns = [
       { name: "Name", field: "Name", sortable: false },
       { name: "Status", field: "Status", type: "status", displayStatus: waz.interaction.statusIconHelper(statusIcons), filterable: false, sortable: false },
       { name: "Type", field: "Type", filterable: false, sortable: false },
       { name: "Expires", field: "ExpiryDate", filterable: false, sortable: false, formatter: dateFormatter }
     ];
   
     grid = renderArea.find(".gridContainer")
       .wazObservableGrid("destroy")
       .wazObservableGrid({
         lastSelectedRow: null,
         data: localDataSet.data,
         keyField: "name",
         columns: columns,
         gridOptions: {
           // Function to call when a row is selected. Optional.
           rowSelect: onRowSelected
         },
         // If the grid is empty, a template can be rendered instead, typically suggesting to the user that they create a new resource
         emptyListOptions: {
           extensionName: "DomainTenantExtension",
           templateName: "domainsTabEmpty",
           arrowLinkSelector: ("{0} .dm-new-domain-link").format(renderArea.selector),
           arrowLinkAction: global.DomainTenantExtension.CreateWizard.showCreateWizard
           }
         });
       }
   

Zobacz też

Wykonywanie typowych zadań w rozszerzeniu portalu administracyjnego pakietu azure Windows