UI Grid refresh in Angular

Question

From a different controller a modal pop up opens. On closing of the modal pop up , I will do something and I want to transfer the data to a different controller which populates a UI grid and is bound to $scope.searchResultsGridOptions .

So in my ABCCtrl.js file :

On closing of a modal , I do :

$("#iConfirmationModal").on('hidden.bs.modal', function () {
    $state.go('transaction.search.results', {});
    //I close all the modals
    $uibModalStack.dismissAll();
    //I get the stored search criteria 
    var searchResultsParam = TransactionDataServices.getSavedSearchParams();


    //Using them I hit the web service again and get the data to reload the UI Grid 
    TransactionServices.getTransactionAdvSearchResults(searchResultsParam).then(function (result) {

            //I got the result
            console.log(result);
            /Now I want to reload the grid with this data , but the grid scope object which binds to this , is in separate controller
            searchResultsGridOptions.data = result;
        });
    });

In DEFCtrl.js

I have

    getSearchResultsGridLayout: function (gridOptions, uiGridConstants, datas) {
        gridOptions.multiSelect = false;
        //  gridOptions.data.length = 0;
        // gridOptions.data = '';
        gridOptions.data = datas;
        console.log("Grid Data ");
        console.log(datas);
        console.log(gridOptions.data);
        angular.element(document.getElementsByClassName('grid')[0]).css('height', '0px');
        // console.log(datas.length);
        return gridOptions;
    }

But how would I only change the data only when modal closes ?

Rest of the time it should not refresh the Grid ?

Or ,

Is there any way when on closing of the modal , instead of simply go back to the state using $state.for() and seeing the previous unrefreshed data , I can see the refreshed data ?

Answer 1

Hi I think you do not need to call the "TransactionServices.getTransactionAdvSearchResults()" in the "ABCCtrl" controller but you have to call it in the "DEFCtrl" controller.

You need to find a way to pass the "searchResultsParam" extracted in "ABCCtrl" to "DEFCtrl".

You can use the ui-router state parameters . You can specify a parameter in the "transaction.search.results" state, like this:

.state('transaction.search.results', {
    ...
    params: {
        searchResultsParam: null
    }
   ...
})

And in the "ABCCtrl" pass it to the state:

$("#iConfirmationModal").on('hidden.bs.modal', function () {
    //I close all the modals
    $uibModalStack.dismissAll();
    //I get the stored search criteria 
    var searchResultsParam = TransactionDataServices.getSavedSearchParams();
    $state.go('transaction.search.results', {searchResultsParam: searchResultsParam});

Then, in "DEFCtrl" you can read it and call the "TransactionServices.getTransactionAdvSearchResults()" method.