# Interactive grid

**URL:** <https://phaser.discourse.group/t/interactive-grid/5405>\
**Category:** Phaser 3\
**Created:** [March 5, 2020, 12:33pm UTC](https://phaser.discourse.group/t/interactive-grid/5405 "2020-03-05T12:33:52Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![Alinochka](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/alinochka/32/1667_2.png) [@Alinochka](https://phaser.discourse.group/u/Alinochka)\
**Post date:** [March 5, 2020, 12:33pm UTC](https://phaser.discourse.group/t/interactive-grid/5405/1 "2020-03-05T12:33:52Z")

</div>

Hi, I just started to learn Phaser. Before I never tried to create any games.  
I need to make a table with which I could interact by clicking on it (click-add a picture to a cell), as if I play tic-tac-toe.  
This is necessary so that the player can place obstacles for the game, thus editing the scene on his own.  
In addition, I want to save the coordinates of the selected cell in Redux.  
In order to save what the player created and start the game with obstacles such as he chose.  
Could you please help me with it?  
What do I need to use? How do I center the picture in the cell? How can I save the cell coordinate and then play the scene edited by the player?  
Thanks a lot!

---

<div class="post-metadata">

**Author:** ![PBMCube](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/pbmcube/32/93_2.png) [@PBMCube](https://phaser.discourse.group/u/PBMCube)\
**Post date:** [March 5, 2020, 9:43pm UTC](https://phaser.discourse.group/t/interactive-grid/5405/2 "2020-03-05T21:43:37Z")

</div>

Would this help? Look at lines near 146 for a discussion of using “groups, containers, or just simple double loops”.

> **[play-colorMatchwithFlipReturn.pdf](https://makingbrowsergames.com/starterkits/memorymatch/p3/wcMath101/js/state/play-colorMatchwithFlipReturn.pdf)**
>
> 109.69 KB

---

<div class="post-metadata">

**Author:** ![Alinochka](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/alinochka/32/1667_2.png) [@Alinochka](https://phaser.discourse.group/u/Alinochka)\
**Post date:** [March 6, 2020, 3:59pm UTC](https://phaser.discourse.group/t/interactive-grid/5405/3 "2020-03-06T15:59:26Z")

</div>

Hi, thanks 🙂  
Now I’m trying to use Grid class.  
Maybe there is some solution for him?

---

<div class="post-metadata">

**Author:** ![PBMCube](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/pbmcube/32/93_2.png) [@PBMCube](https://phaser.discourse.group/u/PBMCube)\
**Post date:** [March 6, 2020, 11:11pm UTC](https://phaser.discourse.group/t/interactive-grid/5405/4 "2020-03-06T23:11:50Z")

</div>

From what I understand, the “grid class” creates only a “checker board”. I haven’t used it very much due to its limitations.