Skip to content
This repository was archived by the owner on Mar 5, 2024. It is now read-only.

Commit 378fbb2

Browse files
committed
Update the readme to include a description of the event handlers
1 parent 54120b6 commit 378fbb2

File tree

1 file changed

+27
-0
lines changed

1 file changed

+27
-0
lines changed

README.md

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -65,6 +65,33 @@ The defaults for the grid item are:
6565
}
6666
```
6767

68+
#### Event Handling
69+
-------------------
70+
71+
Both the `NgGrid` and `NgGridItem` throw events when an item is moved or resized. The grid has the following:
72+
73+
```javascript
74+
dragStart(item) // When an item starts being dragged. Returns reference to corresponding NgGridItem
75+
drag(item) // When an item moves while dragging. Returns reference to corresponding NgGridItem
76+
dragStop(item) // When an item stops being dragged. Returns reference to corresponding NgGridItem
77+
resizeStart(item) // When an item starts being resized. Returns reference to corresponding NgGridItem
78+
resize(item) // When an item is resized. Returns reference to corresponding NgGridItem
79+
resizeStop(item) // When an item stops being resized. Returns reference to corresponding NgGridItem
80+
```
81+
82+
The individual items will also throw the following events:
83+
84+
```javascript
85+
dragStart({'left': number, 'top': number}) // When the item starts being dragged. Returns object containing the item's raw left and top values
86+
drag({'left': number, 'top': number}) // When the item moves while dragging. Returns object containing the item's raw left and top values
87+
dragStop({'left': number, 'top': number}) // When the item stops being dragged. Returns object containing the item's raw left and top values
88+
resizeStart({'width': number, 'height': number}) // When the item starts being resized. Returns object containing the item's raw width and height values
89+
resize({'width': number, 'height': number}) // When the item is resized. Returns object containing the item's raw width and height values
90+
resizeStop({'width': number, 'height': number}) // When the item stops being resized. Returns object containing the item's raw width and height values
91+
itemChange({'col': number, 'row': number, // When the item's grid size or position is changed. Returns object containing the item's grid position and size
92+
'sizex': number, 'sizey': number}) // The difference between this event and the above is that the values correspond to the psuedo-grid and not the dom positioning
93+
```
94+
6895
#### Styling
6996
------------
7097

0 commit comments

Comments
 (0)