Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Number of displayed rows is limited by number of columns in ng-table-dynamic #1041

Open
grosseman opened this issue Aug 23, 2018 · 1 comment

Comments

@grosseman
Copy link

grosseman commented Aug 23, 2018

I have a very bizzare problem. I am pulling my data from an API through a getData function in increments of 20 per page. The data is coming through so the problem does not lie here. No filters are applied to the data.

I declare my columns through a variable:
this.columns = [ { field: "selector", title: "", show: true//, headerTemplateURL: "app/core/headerCheckbox.html" }, { field: "barcode", //filter: {barcode: "text"}, title: "Streckkod", show: true, "class": "list-table-header" }, {...}];

and so on. 12 columns in total. In HTML the table is declared as so:

<table ng-table-dynamic="$ctrl.tableParams with $ctrl.columns" class="table table-hover table-condensed" show-filter="$ctrl.ngTableFilterRowVisible">

Then comes ng-repeat:
<tr ng-repeat-start="row in $data" ng-class="{'active' : $ctrl.rowData[$index].isActive }" ng-mouseenter="$ctrl.toggleHover($index)" ng-mouseleave="$ctrl.toggleHover($index)" title="Click for details..">

..followed by a <td></td> pair for each column. Finally

</tr><tr ng-repeat-end="" class="expandedRow" ng-show="$ctrl.rowData[$index].expandRow"><td colspan="12">Test</td></tr>

However, no matter how many rows are returned from the getData function, the table refuses to display more than 12 rows, same as the number of columns. In fact, if I reduce the column count to 1, along goes the number of rows!

Only column 1 visible:

scrn1

Column 1 and 2 visible:

scrn2

Inspecting the HTML, the reason the rows are not displayed appears to be that the <td></td> elements are not being generated for any rows surpassing the column count (2 in this case):

rowsempty

while a "healthy" row looks like this:

rows

What could possibly be causing this?

Edit

Adding an empty <th></th> before <tr ng-repeat-start..> appears to fix the problem...

<th ng-if=""></th> fixes the problem and gets rid of the unneeded empty row.

@streetchief
Copy link

After much struggling, we fixed this issue by adding a whole empty row inside the repeated tbody element.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants