I have an Angularjs smart-table that has sort definitions set for each column, ie which direction.

What I want to ensure is that every time the page loads, the original sort direction is preserved, ideally to control with a variable. I have noticed with some pagination code I am doing that when you select page 2, the sort order changes sometimes so the second page you get doesn't relate to page 1.

How can I maintain control over what column and direction is being sorted and maintain that state?

<table st-table="displayedCollection" st-pipe="getModelRuns" st-sort="EXECUTIONPOOL" st-sort-default="reverse" st-safe-src="rowCollection" class="table table-condensed" ng-show="displayedCollection.length > 0">
  <thead>
    <tr>
      <th st-sort="NAME" st-skip-natural="true"><i ng-class="getSortIcon('JobName')"></i> <a data-ng-href="#" style="white-space: nowrap">Job Name</a></th>
      <th st-sort="CLOUDJOBNAME" st-skip-natural="true"><i ng-class="getSortIcon('CloudJobName')"></i> <a data-ng-href="#" style="white-space: nowrap">Cloud Job Name</a></th>
      <th st-sort="MODELVERSION" st-skip-natural="true"><i ng-class="getSortIcon('ModelVersion')"></i> <a href="#">Model Version</a></th>
      <th st-sort="RUNSTATUS" st-skip-natural="true"><i ng-class="getSortIcon('Status')"></i> <a href="#">Status</a></th>
      <th st-sort="REQUESTEDAT" st-skip-natural="true" st-sort-default="reverse"><i ng-class="getSortIcon('Requested')"></i> <a href="#">Requested At</a></th>
      <th st-sort="STARTEDAT" st-skip-natural="true" st-sort-default="reverse"><i ng-class="getSortIcon('Started')"></i> <a href="#">Started At</a></th>
      <th st-sort="FINISHEDAT" st-skip-natural="true" st-sort-default="reverse"><i ng-class="getSortIcon('Finished')"></i> <a href="#">Finished At</a></th>
      <th st-sort="REQUESTEDBY" st-skip-natural="true"><i ng-class="getSortIcon('RequestedBy')"></i> <a href="#">Requested By</a></th>
      <th st-sort="EXECUTIONPOOL" st-skip-natural="true"><i ng-class="getSortIcon('ExecutionPool')"></i> <a href="#">Executed on Pool</a></th>
      <th />
    </tr>
  </thead>
</table>

I have an Angularjs smart-table that has sort definitions set for each column, ie which direction.

What I want to ensure is that every time the page loads, the original sort direction is preserved, ideally to control with a variable. I have noticed with some pagination code I am doing that when you select page 2, the sort order changes sometimes so the second page you get doesn't relate to page 1.

How can I maintain control over what column and direction is being sorted and maintain that state?

<table st-table="displayedCollection" st-pipe="getModelRuns" st-sort="EXECUTIONPOOL" st-sort-default="reverse" st-safe-src="rowCollection" class="table table-condensed" ng-show="displayedCollection.length > 0">
  <thead>
    <tr>
      <th st-sort="NAME" st-skip-natural="true"><i ng-class="getSortIcon('JobName')"></i> <a data-ng-href="#" style="white-space: nowrap">Job Name</a></th>
      <th st-sort="CLOUDJOBNAME" st-skip-natural="true"><i ng-class="getSortIcon('CloudJobName')"></i> <a data-ng-href="#" style="white-space: nowrap">Cloud Job Name</a></th>
      <th st-sort="MODELVERSION" st-skip-natural="true"><i ng-class="getSortIcon('ModelVersion')"></i> <a href="#">Model Version</a></th>
      <th st-sort="RUNSTATUS" st-skip-natural="true"><i ng-class="getSortIcon('Status')"></i> <a href="#">Status</a></th>
      <th st-sort="REQUESTEDAT" st-skip-natural="true" st-sort-default="reverse"><i ng-class="getSortIcon('Requested')"></i> <a href="#">Requested At</a></th>
      <th st-sort="STARTEDAT" st-skip-natural="true" st-sort-default="reverse"><i ng-class="getSortIcon('Started')"></i> <a href="#">Started At</a></th>
      <th st-sort="FINISHEDAT" st-skip-natural="true" st-sort-default="reverse"><i ng-class="getSortIcon('Finished')"></i> <a href="#">Finished At</a></th>
      <th st-sort="REQUESTEDBY" st-skip-natural="true"><i ng-class="getSortIcon('RequestedBy')"></i> <a href="#">Requested By</a></th>
      <th st-sort="EXECUTIONPOOL" st-skip-natural="true"><i ng-class="getSortIcon('ExecutionPool')"></i> <a href="#">Executed on Pool</a></th>
      <th />
    </tr>
  </thead>
</table>

• javascript
• angularjs
• sorting
• smart-table

1 Answer 1

I think you asked for default ascending order in table, you can set like

 st-sort-default="true"

but you have set reverse so its probably in reverse order for you.