As a newcomer to using agGrid, please excuse any mistakes I may make. Previously, I worked with Kendo Grid on AngularJS, but we decided to switch to a different grid, so we're currently exploring agGrid.
Below is a sample of agGrid that is functioning properly. However, when I move my grid options inside a function that is called upon clicking a button, I encounter a warning - grid options for ag-Grid not found. Please ensure the attribute ag-grid points to a valid object on the scope.
I'm puzzled by this issue because within this function, Kendo Grid options work as expected and the grid gets populated. I'm unsure of what I might be doing wrong with agGrid.
Your assistance would be greatly appreciated.
function abc($rootScope,$scope, $state, $stateParams, $timeout, Upload, baseURL, $cookieStore, $log, errorCheckFactory) {
var columnDefs = [
{headerName: "Make", field: "make"},
{headerName: "Model", field: "model"},
{headerName: "Price", field: "price"}
];
var rowData = [
{make: "Toyota", model: "Celica", price: 35000},
{make: "Ford", model: "Mondeo", price: 32000},
{make: "Porsche", model: "Boxter", price: 72000}
];
$scope.gridOptions2 = {
columnDefs: columnDefs,
rowData: rowData,
enableFilter: true,
enableColResize: true,
enableSorting: true,
groupHeaders: true,
rowHeight: 22,
//onModelUpdated: onModelUpdated,
suppressRowClickSelection: true
};
}