How to disable an Angular UI-Grid

Question

I'm using a UI-Grid control for user input in a big project at work. There are cases when the grids should be available in read-only mode, meaning that any clicks from the user should remain without effect.

I have searched the documentation as much as I could, but all I've come up with is the isRowSelectable property in the options of the grid. However, I am also using the grid as a treeView. And the expand/collapse buttons are still active.

Is there a possibility to make the grid read-only as if it had supported a "disabled" attribute the way that text inputs do? Is it possible to disable it altogether?

I used combination of this answer plus ng-class attribute. — gce
– gce, Commented Jul 29, 2022 at 13:21

AbVog · Accepted Answer · 2016-02-18 10:18:10Z

1

In the end, I have used a div acting as an overlay that I put right above the grid. It has a semi-transparent gray background, the exact dimensions of the grid, a higher z-index, a not-allowed cursor, and a no-op click handler.

Depending on whether the parent container of the grid (and the overlay) has a CSS class that says the grid is meant to be disabled, the overlay shows up and blocks the user from interacting with the grid. It's a simple solution that covers my needs.

answered Feb 18, 2016 at 10:18

AbVog

1,6071 gold badge23 silver badges39 bronze badges

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

Collectives™ on Stack Overflow

How to disable an Angular UI-Grid

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related