# setInteractive method

**URL:** <https://phaser.discourse.group/t/setinteractive-method/2884>\
**Category:** Phaser 3\
**Created:** [June 24, 2019, 3:47pm UTC](https://phaser.discourse.group/t/setinteractive-method/2884 "2019-06-24T15:47:49Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![kdhingra](https://avatars.discourse-cdn.com/v4/letter/k/3bc359/32.png) [@kdhingra](https://phaser.discourse.group/u/kdhingra)\
**Post date:** [June 24, 2019, 3:47pm UTC](https://phaser.discourse.group/t/setinteractive-method/2884/1 "2019-06-24T15:47:49Z")

</div>

Can I use the setInteractive function on a physics group?  
I’ve tried it, but I’m getting ‘setInteractive is not a function’ error.  
This is my code:

c = this.physics.add.group({  
key: ‘c’,  
repeat: 0,  
setXY: { x:210 , y: 0}  
});  
this.physics.add.collider(c, stand);  
c.setInteractive();  
this.input.setDraggable ( c );

I’ve loaded ‘c’ as an image in the preload function and the stand is another image it collides with.  
I want to add c as a physics group so I can make it collide and overlap with other images(added as physics groups) and I also want to make this image draggable.

Dragging is the main component of my game and it is not working without being setInteractive().

Thank you!

---

<div class="post-metadata">

**Author:** ![Jake.Caron](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/jake.caron/32/1841_2.png) [@Jake.Caron](https://phaser.discourse.group/u/Jake.Caron)\
**Post date:** [June 24, 2019, 5:20pm UTC](https://phaser.discourse.group/t/setinteractive-method/2884/2 "2019-06-24T17:20:49Z")

</div>

A group is not a GameObject, it’s just a collection of GameObjects. You could do something like the following:

```javascript
let children = c.getChildren();
for(let i = 0; i < children.length; i++)
{
    children[i].setInteractive();
}

```

---

<div class="post-metadata">

**Author:** ![kdhingra](https://avatars.discourse-cdn.com/v4/letter/k/3bc359/32.png) [@kdhingra](https://phaser.discourse.group/u/kdhingra)\
**Post date:** [June 24, 2019, 5:35pm UTC](https://phaser.discourse.group/t/setinteractive-method/2884/3 "2019-06-24T17:35:58Z")

</div>

Hi Jake.  
Thank you so much for your help. I’m very new at phaser so all help is much appreciated.  
After I do this however, the setDraggable is not working.  
I tried putting it inside the for loop too.

In my game, I have 10 images (‘c’ is one of them) and the user has to drag and drop them.  
After that is done, I want to be able to read what order the user has arranged those images in, and display that or record it.

@Jake.Caron this is my complete code as of now:

//var gameScene= new Phaser.Scene(‘Game’);

var config={  
type: Phaser.AUTO,  
width: 1230,  
height: 800,  
physics:{  
default: ‘arcade’,  
arcade: {  
gravity: { y: 300},  
debug: false  
}  
},  
scene: {  
preload: preload,  
create: create,  
//update: update  
}

};

var game= new Phaser.Game(config);  
const droppedObjectIdList = [];  
function preload()  
{  
this.load.image(‘background’,‘assets/background.png’);  
this.load.image(‘a’, ‘assets/Acceptance.png’);  
this.load.image(‘c’, ‘assets/Curiosity.png’);  
this.load.image(‘f’, ‘assets/Freedom.png’);  
this.load.image(‘o’, ‘assets/Order.png’);  
this.load.image(‘p’, ‘assets/Power.png’);  
this.load.image(‘r’, ‘assets/Relatedness.png’);  
this.load.image(‘s’, ‘assets/Status.png’);  
this.load.image(‘h’, ‘assets/Honor.png’);  
this.load.image(‘g’, ‘assets/Goal.png’);  
this.load.image(‘m’, ‘assets/Mastery.png’);  
this.load.image(‘bar’,‘assets/bar.png’);  
}

function create() {  
this.add.image(615, 400, ‘background’);  
bar= this.physics.add.staticGroup();  
bar.create(615,450,‘bar’);  
var mvs= [‘c’,‘h’,‘a’,‘m’,‘p’,‘f’,‘r’,‘o’,‘g’,‘s’];

```
for (var i=0; i<10 ;i++)
{
    
    this.input.setDraggable(this.add.image(210+(90*i), 200, mvs[i]).setInteractive());

}    

// for (var i=0;i<10;i++)
// {
// this.physics.add.staticGroup({
// key: mvs[i],
// setXY: {x: 210, y: 200, stepX: (90*i)}
// });
// this.physics.add.collider(mvs[i], bar);
// }

this.input.on('drag',function(pointer, gameObject, dragX, dragY){
	gameObject.x=dragX;
    gameObject.y=dragY;
 });

```

//function update(){  
this.input.on(“dragend”, function(pointer, gameObject)  
{  
droppedObjectIdList.push(this.id);  
});  
for (i=0;i\<10;i++)  
{  
[//this.add.text](https://this.add.text)(600, 500, ‘hello’,  
this.add.text(600, 500, droppedObjectIdList[i],{ fill: “#ffffff”});  
}  
//}

}

I’ve been stuck for days. Could you help ?

---

<div class="post-metadata">

**Author:** ![Benstrocity](https://avatars.discourse-cdn.com/v4/letter/b/a4c791/32.png) [@Benstrocity](https://phaser.discourse.group/u/Benstrocity)\
**Post date:** [June 24, 2019, 7:18pm UTC](https://phaser.discourse.group/t/setinteractive-method/2884/4 "2019-06-24T19:18:18Z")

</div>

What error are you getting in your console

---

<div class="post-metadata">

**Author:** ![kdhingra](https://avatars.discourse-cdn.com/v4/letter/k/3bc359/32.png) [@kdhingra](https://phaser.discourse.group/u/kdhingra)\
**Post date:** [June 24, 2019, 7:34pm UTC](https://phaser.discourse.group/t/setinteractive-method/2884/5 "2019-06-24T19:34:45Z")

</div>

setDraggable not defined is the error I’m getting when I add the images as physics group.

---

<div class="post-metadata">

**Author:** ![Benstrocity](https://avatars.discourse-cdn.com/v4/letter/b/a4c791/32.png) [@Benstrocity](https://phaser.discourse.group/u/Benstrocity)\
**Post date:** [June 24, 2019, 7:48pm UTC](https://phaser.discourse.group/t/setinteractive-method/2884/6 "2019-06-24T19:48:48Z")

</div>

It’s telling you that `this.input` hasn’t been defined yet. From what you have provided I don’t see where you have defined `this.input`.

---

<div class="post-metadata">

**Author:** ![samme](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/samme/32/5275_2.png) [@samme](https://phaser.discourse.group/u/samme)\
**Post date:** [June 24, 2019, 9:35pm UTC](https://phaser.discourse.group/t/setinteractive-method/2884/7 "2019-06-24T21:35:29Z")

</div>

Also [Actions.SetHitArea()](https://photonstorm.github.io/phaser3-docs/Phaser.Actions.html#.SetHitArea__anchor) for this.