Add a Custom Details View

Suppose you want to add a [details] link to each row of an assay run table, that takes you to a custom details view for that row. You can add new views to the module-based assay by adding html files in the views/ directory, for example:

assay/<assay-name>/views/<view-name>.html

The overall page template will include JavaScript objects as context so that they're available within the view, avoiding an extra client API request to fetch it from the server. For example, the result.html page can access the assay definition and result data as LABKEY.page.assay and LABKEY.page.result respectively. Here is an example custom details view named result.html:

1 <table>
 2   <tr>
 3     <td class='labkey-form-label'>Sample Id</td>
 4     <td><div id='SampleId_div'>???</div></td>
 5   </tr>
 6   <tr>
 7     <td class='labkey-form-label'>Time Point</td>
 8     <td><div id='TimePoint_div'>???</div></td>
 9   </tr>
10   <tr>
11     <td class='labkey-form-label'>Double Data</td>
12     <td><div id='DoubleData_div'>???</div></td>
13   </tr>
14 </table>
15
16 <script type="text/javascript">
17   function setValue(row, property)
18   {
19     var div = Ext.get(property + "_div");
20     var value = row[property];
21     if (!value)
22       value = "<none>";
23     div.dom.innerHTML = value;
24   }
25
26   if (LABKEY.page.result)
27   {
28     var row = LABKEY.page.result;
29     setValue(row, "SampleId");
30     setValue(row, "TimePoint");
31     setValue(row, "DoubleData");
32   }
33 </script>

Note on line 28 the details view is accessing the result data from LABKEY.page.result. See Example Assay JavaScript Objects for a description of the LABKEY.page.assay and LABKEY.page.result objects.

Add a custom view for a run

Same as for the custom details page for the row data except the view file name is run.html and the run data will be available as the LABKEY.page.run variable. See Example Assay JavaScript Objects for a description of the LABKEY.page.run object.

Add a custom view for a batch

Same as for the custom details page for the row data except the view file name is batch.html and the run data will be available as the LABKEY.page.batch variable. See Example Assay JavaScript Objects for a description of the LABKEY.page.batch object.