Smart table - angularJs - ajax refresh table

Question

I am using the angularjs mudule smart table.

My table has server-side processing and all the data load is located on the server. I want to have a refresh button outside of the table.

This is the function that makes a call to the server and I want to be able to call it manually, but I can't figure out how to retrieve the table state in the my controller.

this.callServer = function callServer(tableState) {

        ctrl.isLoading = true;

        var pagination = tableState.pagination;

        var start = pagination.start || 0;     // This is NOT the page number, but the index of item in the list that you want to use to display the table.
        var number = pagination.number || 10;  // Number of entries showed per page.

        service.getPage(start, number, tableState, ctrl.startDateFilter,
                ctrl.endDateFilter).then(function (result) {
            ctrl.displayed = result.data;
            tableState.pagination.numberOfPages = result.numberOfPages;
            ctrl.isLoading = false;
        });
    };

My goal is to have a function like this, How can I get the table state?

    this.refreshTable = function(){
        tableState = getTableState();
        ctrl.callServer(tableState);
    }

henriquels · Accepted Answer · 2016-08-04 13:49:19Z

3

The solution is to put the table state in a controller variable.

Everytime the callServer function is called, it will update this variable. This way, I am able to refresh the table.

    this.tableState = null;

    this.callServer = function callServer(tableState) {
        ctrl.tableState = tableState;
        ...
    }

    this.refreshGrid = function(){
        ctrl.callServer(ctrl.tableState);
    }

answered Aug 4, 2016 at 13:49

henriquels

5461 gold badge5 silver badges23 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Munir · Accepted Answer · 2017-09-04 22:17:48Z

1

You can also create a directive to do it.

View

<table st-pipe="productsTableCtrl.getTableData" 
st-table="productsTableCtrl.tableData" refresh-table>

Inside your Controller

$scope.$broadcast('refreshMyTable');

Directive

app.directive("refreshTable", function(){
    return {
        require:'stTable',
        restrict: "A",
        link:function(scope,elem,attr,table){
            scope.$on("refreshMyTable", function() {
                table.pipe(table.tableState());
            });
    }
}});

Credits to gtaylor44: https://github.com/lorenzofox3/Smart-Table/issues/363#issuecomment-246636293

answered Sep 4, 2017 at 22:17

Munir

7592 gold badges14 silver badges39 bronze badges

Collectives™ on Stack Overflow

Smart table - angularJs - ajax refresh table

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related