다음을 통해 공유

Windows Azure Pack 관리 포털 확장에 그리드를 표시하는 방법

  • 아티클

 

적용 대상: Windows Azure Pack

그리드는 사용자에게 데이터 목록을 표시하는 기본 방법입니다. 다중 선택, 열 다시 정렬 및 정렬, 아이콘 및 텍스트 표시, 정의된 데이터 원본에서 자체 자동 새로 고침을 지원합니다. 일반적인 패턴은 사용자가 탭을 선택할 때 확장에서 그리드를 표시하는 것입니다.

사용자가 탭을 선택할 때 그리드를 표시하려면

  1. 탭의 열린 함수에 다음 그리드 코드를 넣습니다.

    // 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
        }
      });
    }

참고 항목

Windows Azure Pack 관리 포털 확장에서 일반 작업 수행