2012-04-12 29 views

回答

2

下面是一個示例應用程序,該應用程序動態構建一個包含迭代名稱作爲列的表配置,然後向其添加一些虛擬數據。不太令人興奮,但它說明了這個想法。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
    <!-- Copyright (c) 2002-2011 Rally Software Development Corp. All rights reserved. --> 

    <html> 
    <head> 
     <title>Iterations as Table Columns</title> 
     <meta name="Name" content="App: Iterations as Table Columns"/> 
     <script type="text/javascript" src="https://rally1.rallydev.com/apps/1.29/sdk.js"></script> 


     <script type="text/javascript"> 
      function iterationsAsTableColumns(rallyDataSource) 
       { 

        var wait = null; 
        var table = null; 
        var tableHolder = null; 

        // private method the builds the table of Iteration columns and your info 
        function showResults(results) 
        { 
         if (wait) { 
          wait.hide(); 
          wait = null; 
         } 
         if (table) { 
          table.destroy(); 
         } 

         var myIterations = results.iterations; 

         if (myIterations.length === 0) { 
          tableHolder.innerHTML = "No iterations were found"; 
          return; 
         } 

         var columnKeys = new Array(); 
         var columnHeaders = new Array(); 
         var columnWidths = new Array(); 
         var columnWidthValue = '80px'; 
         var keyName; 

         // Dynamically build column config arrays for table config 
         for (i=0; i<myIterations.length;i++){ 
          keyName = "Column"+i; 
          columnKeys.push(keyName); 
          columnHeaders.push("'" + myIterations[i].Name + "'"); 
          columnWidths.push("'" + columnWidthValue + "'"); 
         } 

         var config = { 'columnKeys' : columnKeys, 
             'columnHeaders' : columnHeaders, 
             'columnWidths' : columnWidths 
            }; 

         table = new rally.sdk.ui.Table(config); 

         var cellValue; 
         var propertyAttributeStatement; 
         var rowData = new Array(); 

         for (i=0;i<10;i++){ 

          // create Object for row data 
          rowItem = new Object(); 

          for (j=0; j<columnKeys.length;j++){ 

           cellValue = "Cell[" + i + "][" + j + "] = Your Data Here"; 
           propertyAttributeStatement = "rowItem." + columnKeys[j] + " = '"+cellValue+"';"; 
           eval(propertyAttributeStatement); 
          } 

          rowData.push(rowItem); 
         } 

         table.addRows(rowData); 
         table.display(tableHolder); 
        } 


        //private method to query for iterations that get listed as columns 
        function runMainQuery(sender, eventArgs) { 

         var queryCriteria = '(Project.Name = "Avalanche Hazard Mapping"")'; 

         var queryConfig = 
          { 
          key : "iterations", 
          type : "Iteration", 
          fetch : "FormattedID,Name,Project,StartDate,EndDate,CreationDate", 
          order : "CreationDate desc", 
          }; 

         tableHolder.innerHTML = ""; 
         wait = new rally.sdk.ui.basic.Wait({}); 
         wait.display(tableHolder); 

         rallyDataSource.findAll(queryConfig, showResults); 
        } 

        //private method to start building controls on page 
        function initPage() { 

         buttonSpan = document.getElementById('buttonSpan'); 
         tableHolder = document.getElementById('table'); 

         var buttonConfig = { 
           text: "Show Table", 
           value: "myValue" 
         }; 

         var showTableButton = new rally.sdk.ui.basic.Button(buttonConfig); 
         showTableButton.display(buttonSpan, runMainQuery); 

        } 

        // only public method 
        this.display = function() { 
         rally.sdk.ui.AppHeader.showPageTools(true); 

         initPage(); 
        }; 

       } 


     </script> 
     <script type="text/javascript"> 
      rally.addOnLoad(function() { 
       var rallyDataSource = new rally.sdk.data.RallyDataSource('__WORKSPACE_OID__', 
                     '__PROJECT_OID__', 
                     '__PROJECT_SCOPING_UP__', 
                     '__PROJECT_SCOPING_DOWN__'); 
       var iterationsAsTableColumnsExample = new iterationsAsTableColumns(rallyDataSource); 
       iterationsAsTableColumnsExample.display(); 
      }); 
     </script> 
    </head> 

    <body> 
     <div> 
      <span id="buttonSpan"></span> 
     </div> 
     <div style="height: 15px;">&nbsp;</div> 
     <div id="table"></div> 
    </body> 

    </html> 
+0

請注意,如果您需要刷新您的表格(例如,如果有一個釋放下拉菜單按日期選擇迭代),則需要在任何現有表格上調用destroy(),而不是僅僅消隱outHTML。 – 2012-04-13 12:11:40

+0

謝謝凱爾!這個塊不這樣做嗎?如果(表){table.destroy();}或者它需要去其他地方 – 2012-04-13 13:45:13

+0

糟糕..是的,你是對的。 :-) – 2012-04-13 19:08:09

相關問題