Defects by State

This example demonstrates the integration of multiple components to create a basic app.
A table displays defects filtered using a drop-down.
This example also demonstrates a table querying for its own data and rendering basic components in its cells.

defects by state

Example code

Copy and paste the following into a CA Agile Central custom page to see it in action!

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!-- Copyright (c) 2010 CA Agile Central Software Development Corp. All rights reserved -->
<html>
<head>
   <title>Defects By State</title>
   <meta name="Name" content="App Example: Defects by State" />
   <meta name="Version" content="2011.04.02" />
   <meta name="Vendor" content="CA Agile Central Software" />

   <script type="text/javascript" src="/apps/1.26/sdk.js"></script>
   <script type="text/javascript">

     var rallyDataSource;
     var table;

     function onSelectionChanged(sender, eventArgs) {

      if(table) {
        table.destroy();
      }

      var tableConfig = {
        columnKeys: ["FormattedIDLink", "Name", "Priority"],
         columnHeaders: ["Formatted ID", "Name", "Priority"],
         type: "defect",
         query: '(State = "' + eventArgs.value + '")',
        fetch: "Name,FormattedID,Priority"
       };

      table = new rally.sdk.ui.Table(tableConfig, rallyDataSource);
      table.addEventListener(table.getValidEvents().onDataRetrieved, function(t, args) {
         rally.forEach(args.items, function(item) {
          //Create a link component
           item.FormattedIDLink = new rally.sdk.ui.basic.Link({item: item});
         });
       });
       table.display("defects");
    }

    function onLoad() {
       rallyDataSource = new rally.sdk.data.CA Agile CentralDataSource('__WORKSPACE_OID__',
                                         '__PROJECT_OID__',
                                         '__PROJECT_SCOPING_UP__',
                                         '__PROJECT_SCOPING_DOWN__'
);
      var config = {
           type: "defect",
           attribute: "state",
          label: "State: ",
           showLabel: true
                  };

      var attributeDropdown = new rally.sdk.ui.AttributeDropdown(config, rallyDataSource);
       attributeDropdown.display("attrDropdown", onSelectionChanged);
    }

    rally.addOnLoad(onLoad);

   </script>

</head>
<body>
   <div id="attrDropdown"></div>
   <div id="defects" style="width:500px; height: 400px; margin-top:15px"></div>
</body>
</html>

Feedback

Need more help? The CA Agile Central Community is your one-stop shop for self-service and support. To submit feedback or cases to CA Agile Central Support, find answers, and collaborate with others, please join us in the CA Agile Central Community.