tm1Ui table paging issue - not refreshing after selection change


#1

Hi All

I have a simple table set up with pagination and zero suppression. It works fine on initial load of the page, showing the first 10 records, with a total of 94 pages. However, after changing a cost center selection, instead of refreshing the table and showing the first 10 records for the new selection, it seems to keep the table as is (still with 94 pages), but only display the records for the new selection. So, if the new selection doesn’t have any records in the first 10, then the table shows up as blank, and you have to page through to find some records.

How can I get the table to fully reload itself after changing a selection?

Here is the table html code:

[CODE]

<tm1-ui-element-list tm1-instance="veolia" tm1-dimension="FUE Driver Name" tm1-mdx="{TM1SORT( {TM1FILTERBYLEVEL( {TM1SUBSETALL( [FUE Driver Name] )}, 0)}, ASC)}" attributres="EN Name" ng-model="lists.driver">
</tm1-ui-element-list>

<div class="col-md-12">
	<table class="table table-striped">

	<thead>
			<tr>
				<th class="text-center"> Driver </th>
				<th class="text-center"> Total {{selections.year}} </th>
				<th class="text-center" ng-repeat="month in lists.month"> {{month.alias}} </th>
			</tr>
	</thead>

	<tbody>
			<tr ng-show="driver.value!='0'" ng-repeat="driver in table.data()">
				<td>
					<tm1-ui-element-list-item tm1-item="driver" tm1-item-display="{{driver.key}}">
					</tm1-ui-element-list-item>
				</td>
				<td class="text-right">
					<tm1-ui-dbr tm1-instance="veolia" tm1-cube="FUE Fuel Reporting" tm1-elements='"FIN Total Year {{selections.year}}","{{selections.costcenter}}","{{driver.key}}","Total FUE Product","{{selections.measure}}","Base Period","Base Units"'	tm1-data-decimal="0" ng-model="driver.value">
					</tm1-ui-dbr>
				</td>
				<td class="text-right" ng-repeat="month in lists.month">
					<tm1-ui-dbr tm1-instance="veolia" tm1-cube="FUE Fuel Reporting"	tm1-elements='"{{month.key}}","{{selections.costcenter}}","{{driver.key}}","Total FUE Product","{{selections.measure}}","Base Period","Base Units"' tm1-data-decimal="0" ng-model="driver[month.alias]">
					</tm1-ui-dbr>
				</td>
		</tr>
	</tbody>

	</table>

[/CODE]

And here is the javascript:

$scope.lists = {
    driver: []
};

$scope.table = $tm1Ui.tableCreate($scope.lists.driver, {pageSize:10, preload:false});

Many thanks
David


#2

Hi @anz.fin.all.mailbox,

Try two things at least that function caters for a different use case:

1.) Add a button that will call the table’s refresh() function. So something like:

$scope.reload = function(){
    $scope.table.refresh();
};

2.) Force recreation of the table via $timeout, ng-if and a flag like so:


// note that you will have to add $timeout as one of the services on your controller
/*
['$scope', '$rootScope', '$tm1Ui', '$timeout', function($scope, $rootScope, $tm1Ui, $timeout) 
*/
.
// on page load, this will show the table by default
$scope.values.showData = true;

// this will be the function called when a dedicated reload button is clicked
$scope.reload = function(){
    $scope.values.showData = false; // this is to remove the table from the html
    
    $timeout(function(){
      $scope.values.showData = true; // this will bring it back after 10 millisecond
    }, 10);
  };

Where on your table HTML element, you would have an ng-if:

<table class="table table-striped" ng-if="values.showData">

Let us know how it goes.


Paul


#3

Hi Paul

Thanks for your suggestions. I was struggling to get them working for me when I realised my problem was quite simple. The table was being generated on all row elements and then zero-suppressed based on the selections. I needed to change the MDX filter on the row dimension to include all the selections. The table now renders correctly without the need of a function.

Thanks, and sorry! New to Canvas and have much to learn!

Cheers
David


#4

Hi @anz.fin.all.mailbox,

Great and thanks for the update!

Cheers!


Paul