Permalink
Browse files

Table: Add reflow label even if heading is empty

Fixes gh-7648
Closes gh-7894
  • Loading branch information...
gabrielschulhof committed Dec 30, 2014
1 parent 0e1f405 commit 28e1ae254325c9f915f01ce0c411bd4f7f821559
View
@@ -59,22 +59,18 @@ $.widget( "mobile.table", $.mobile.table, {
contents = $( this ).clone().contents(),
iteration, filter;
if ( contents.length > 0 ) {
if ( hierarchyClass ) {
iteration = parseInt( this.getAttribute( "colspan" ), 10 );
filter = "";
if ( hierarchyClass ) {
iteration = parseInt( this.getAttribute( "colspan" ), 10 );
filter = "";
if ( iteration ) {
filter = "td:nth-child("+ iteration +"n + " + ( colstart ) +")";
}
table._addLabels( cells.filter( filter ),
opts.classes.cellLabels + hierarchyClass, contents );
} else {
table._addLabels( cells, opts.classes.cellLabels, contents );
if ( iteration ) {
filter = "td:nth-child("+ iteration +"n + " + ( colstart ) +")";
}
table._addLabels( cells.filter( filter ),
opts.classes.cellLabels + hierarchyClass, contents );
} else {
table._addLabels( cells, opts.classes.cellLabels, contents );
}
});
},
@@ -0,0 +1,123 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>jQuery Mobile Table Reflow Test Suite</title>
<script src="../../../external/requirejs/require.js"></script>
<script src="../../../js/requirejs.config.js"></script>
<script src="../../../js/jquery.tag.inserter.js"></script>
<script src="../../../tests/jquery.testHelper.js"></script>
<link rel="stylesheet" href="../../../css/themes/default/jquery.mobile.css"/>
<link rel="stylesheet" href="../../../external/qunit/qunit.css"/>
<link rel="stylesheet" href="../../jqm-tests.css"/>
<script src="../../../external/qunit/qunit.js"></script>
<script>
$.testHelper.asyncLoad([
[
"widgets/table.reflow",
],
[
"../../jquery.setNameSpace.immediately.js"
],
[
"table_reflow_heading_core.js"
]
]);
</script>
<script src="../../swarminject.js"></script>
</head>
<body>
<div id="qunit"></div>
<table data-nstest-role="table" id="test-reflow-headings" data-nstest-mode="reflow" class="ui-responsive">
<thead>
<tr class="th-groups">
<th></th>
<th colspan="3">Q1 2012</th>
<th colspan="3">Q2 2012</th>
<th colspan="3">Q3 2012</th>
<th colspan="3">Q4 2012</th>
<th colspan="3" class="totals">YTD Totals</th>
</tr>
<tr>
<th>Store</th>
<th>Income</th>
<th></th>
<th>Change</th>
<th>Income</th>
<th>Profit</th>
<th>Change</th>
<th>Income</th>
<th>Profit</th>
<th>Change</th>
<th>Income</th>
<th>Profit</th>
<th>Change</th>
<th>Income</th>
<th>Profit</th>
<th>Change</th>
</tr>
</thead>
<tbody>
<tr>
<th>Boston</th>
<td>2,898</td>
<td id="interesting-cell">739</td>
<td>-5.8%</td>
<td>3,647</td>
<td>1,354</td>
<td>+5.8%</td>
<td>4,981</td>
<td>2,246</td>
<td>+13.4%</td>
<td>3,457</td>
<td>1,259</td>
<td>-3.9%</td>
<td>12,463</td>
<td>6,234</td>
<td>+5.9%</td>
</tr>
<tr>
<th>Chicago</th>
<td>2,898</td>
<td>739</td>
<td>-5.8%</td>
<td>3,647</td>
<td>1,354</td>
<td>+5.8%</td>
<td>4,981</td>
<td>2,246</td>
<td>+13.4%</td>
<td>3,457</td>
<td>1,259</td>
<td>-3.9%</td>
<td>12,463</td>
<td>6,234</td>
<td>+5.9%</td>
</tr>
<tr>
<th>NYC</th>
<td>2,898</td>
<td>739</td>
<td>-5.8%</td>
<td>3,647</td>
<td>1,354</td>
<td>+5.8%</td>
<td>4,981</td>
<td>2,246</td>
<td>+13.4%</td>
<td>3,457</td>
<td>1,259</td>
<td>-3.9%</td>
<td>12,463</td>
<td>6,234</td>
<td>+5.9%</td>
</tr>
</tbody>
</table>
</body>
</html>
@@ -0,0 +1,5 @@
test( "Heading label added for empty heading", function() {
$( "#test-reflow-headings" ).table();
deepEqual( $( "#interesting-cell" ).children( "b.ui-table-cell-label" ).length, 1,
"Cell beneath empty heading has a copy of the heading" );
});

0 comments on commit 28e1ae2

Please sign in to comment.