1

I have an ODS HTML table made with Proc Report where I need to add an HTML class attribute to a table row <tr>, and not each individual <td> cell in that row. The reason is that this is required in an stickyRow option in the TableSorter jQuery plug-in to keep it from not being sortable as the rest of the table.

The row (a total sum row) is created in a compute statement.

The following statement sets the class to 'static' for each <td> cell in the row, but not in the <tr> which is required in the option.

PROC REPORT

compute BEFORE;
&variabel. = 'Totalt';
call define (_ROW_,"style","style={flyover='Totalt' FONT_WEIGHT=bold 
background=lightgrey class='static'}");
ENDCOMP;

The HTML resolves to this:

<tr>
<td title="Totalt" class="l static" style=" background-color: #d3d3d3; font-weight: bold;”>T</a></td>
<td title="Totalt" class="r static" style=" background-color: #d3d3d3; font-weight: bold;"> 44,737,223</td>
<td title="Totalt" class="r static" style=" background-color: #d3d3d3; font-weight: bold;"> 43,321,900</td>

Is there a way to set the class as 'static' for the entire <tr>-row, and not each cell?

The following is what I need it to be like:

<tr class="static">
<td title="Totalt" class="l" style=" background-color: #d3d3d3; font-weight: bold;”>T</a></td>
<td title="Totalt" class="r" style=" background-color: #d3d3d3; font-weight: bold;"> 44,737,223</td>
<td title="Totalt" class="r" style=" background-color: #d3d3d3; font-weight: bold;"> 43,321,900</td>

UPDATED: Here is a reproducible example:

ODS HTML FILE='H:\Temp\demo.html';
ODS HTML TEXT="
<script src='https://code.jquery.com/jquery-3.2.1.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.28.15/js/jquery.tablesorter.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.28.15/js/jquery.tablesorter.widgets.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.28.15/js/widgets/widget-staticRow.min.js'></script>";

ODS HTML TEXT="
<script>    
$(function(){
$(document).ready(function() { 
$('.table').tablesorter({theme: 'blue', widgets: ['stickyHeaders','zebra','staticRow']});
});
});
</script>";

PROC REPORT DATA=SASHELP.CLASS;
COLUMN SEX AGE N WEIGHT;
DEFINE sex /DISPLAY;
DEFINE age /DISPLAY;
DEFINE weight / ANALYSIS;
RBREAK BEFORE/SUMMARIZE;
COMPUTE before;
CALL DEFINE (_ROW_,"style","style={flyover='Total number and weight' FONT_WEIGHT=bold background=lightgrey class='static'}");
ENDCOMP;
RUN;

ODS HTML CLOSE;
Kim B.
  • 11
  • 4
  • 1
    Can you give a reproducible example? I'm trying to reproduce exactly what you're doing and it's not immediately apparent to me what you're doing in that compute statement. Use `SASHELP.CARS` or `CLASS` or something and make something dummied up. – Joe Aug 11 '17 at 14:11
  • @Joe I've added an example. To make the example work as intended, I have to edit the first row of the table to in the HTML-file. The first row of the table is then treated as a static row by the jQuery tablesorter. – Kim B. Aug 14 '17 at 09:34
  • I wonder if you could use CSS and set a rule saying any 'tr' that is parent to a cell with a class whatever your 'td' ends up having is static? – Joe Aug 17 '17 at 10:01

1 Answers1

0

I've done something similar when integrating jQuery Datatables with PROC REPORT.

From memory, you need to edit the htmlcss and/or phtml tagsets, amending the table_foot and row events, but I can't recall exactly what I did.

I'll try to find my code, and update answer accordingly.

Chris J
  • 7,549
  • 2
  • 25
  • 25