2012-04-12 5 views
2

Используя приложение Rally App SDK, существует ли способ создать таблицу с переменным числом столбцов? Например, для выбранного выпуска столбцы представляют собой итерации в пределах этого диапазона дат выпуска, а строки - каждый проект.Rally App SDK: Есть ли способ иметь переменные столбцы для таблицы?

У меня есть все данные, которые я хочу отобразить, но не знаю, как создать таблицу.

ответ

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

Обратите внимание, что если вы когда-нибудь понадобится, чтобы обновить таблицу (например, если был релиз выпадающий выбрать итерации по дате) вам необходимо позвонить уничтожить() на любой существующей таблицы, а не просто прикрывать из внутреннегоHTML. –

+0

Спасибо, Кайл! Разве этот блок не делает этого? if (table) {table.destroy();} Или нужно идти куда-то еще –

+0

К сожалению ... да, вы правы. :-) –