# Pass variable from button

**URL:** <https://forum.babylonjs.com/t/pass-variable-from-button/379>\
**Category:** Questions\
**Created:** [December 21, 2018, 7:59pm UTC](https://forum.babylonjs.com/t/pass-variable-from-button/379 "2018-12-21T19:59:50Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![gamedev44](https://avatars.discourse-cdn.com/v4/letter/g/a4c791/32.png) [@gamedev44](https://forum.babylonjs.com/u/gamedev44)\
**Post date:** [December 21, 2018, 7:59pm UTC](https://forum.babylonjs.com/t/pass-variable-from-button/379/1 "2018-12-21T19:59:50Z")

</div>

How do you pass a variable from a button? as in:  
var button = BABYLON.GUI.Button.CreateSimpleButton(“but”, “Click Me”);  
button.mesh\_type =“unit”;

```
button.onPointerDownObservable.add(function () {
	console.log(this.mesh_type);
});

```

“this” doesn’t work

---

<div class="post-metadata">

**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\
**Post date:** [December 21, 2018, 8:55pm UTC](https://forum.babylonjs.com/t/pass-variable-from-button/379/2 "2018-12-21T20:55:34Z")

</div>

this here would refer to the source not the current this. 🙂

sorry basically you can use () =\> { } instead of function() { } to access the this you are expecting:

or you can capture another variable:  
var mtype = this.mesh\_type;  
button.onPointerDownObservable.add(function () {  
console.log(mtype);  
});

---

<div class="post-metadata">

**Author:** ![gamedev44](https://avatars.discourse-cdn.com/v4/letter/g/a4c791/32.png) [@gamedev44](https://forum.babylonjs.com/u/gamedev44)\
**Post date:** [December 21, 2018, 9:22pm UTC](https://forum.babylonjs.com/t/pass-variable-from-button/379/3 "2018-12-21T21:22:41Z")

</div>

Lets say I have an array of buttons, how do I assign onPointerdown to them all but access individual variables in the function?

var button = new Array;  
for(vari=1; i\<=10; i++){  
button.id = i;  
button.onPointerDownObservable.add(function () {  
console.log(this.id);  
});  
}

---

<div class="post-metadata">

**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\
**Post date:** [December 21, 2018, 9:24pm UTC](https://forum.babylonjs.com/t/pass-variable-from-button/379/4 "2018-12-21T21:24:28Z")

</div>

replace this.id by button.id in the console.log

---

<div class="post-metadata">

**Author:** ![gamedev44](https://avatars.discourse-cdn.com/v4/letter/g/a4c791/32.png) [@gamedev44](https://forum.babylonjs.com/u/gamedev44)\
**Post date:** [December 21, 2018, 9:41pm UTC](https://forum.babylonjs.com/t/pass-variable-from-button/379/5 "2018-12-21T21:41:58Z")

</div>

this isn’t going to work, the button need to be able to identify itself to the function (sorry left out the array brackets and index)

var button = new Array;  
for(var i=1; i\<=10; i++){  
button[i].id = i;  
button.onPointerDownObservable.add(function () {  
console.log(button[i].id );  
});  
}

---

<div class="post-metadata">

**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\
**Post date:** [December 21, 2018, 9:56pm UTC](https://forum.babylonjs.com/t/pass-variable-from-button/379/6 "2018-12-21T21:56:14Z")

</div>

This works if you replace for var in for let due to capture in javascript else you ll always have i=10 in the callback [https://www.babylonjs-playground.com/#XCPP9Y#822](https://www.babylonjs-playground.com/#XCPP9Y#822)

also you do not need the array at all:  
[https://www.babylonjs-playground.com/#XCPP9Y#826](https://www.babylonjs-playground.com/#XCPP9Y#826)

---

<div class="post-metadata">

**Author:** ![gamedev44](https://avatars.discourse-cdn.com/v4/letter/g/a4c791/32.png) [@gamedev44](https://forum.babylonjs.com/u/gamedev44)\
**Post date:** [December 21, 2018, 10:13pm UTC](https://forum.babylonjs.com/t/pass-variable-from-button/379/7 "2018-12-21T22:13:17Z")

</div>

I see , I can use the [button.name](http://button.name) as a key to access other data…Thanks!

---

<div class="post-metadata">

**Author:** ![aWeirdo](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/aweirdo/32/52_2.png) [@aWeirdo](https://forum.babylonjs.com/u/aWeirdo)\
**Post date:** [December 21, 2018, 10:13pm UTC](https://forum.babylonjs.com/t/pass-variable-from-button/379/8 "2018-12-21T22:13:35Z")

</div>

You can also use function.bind() 🙂

```
button.onPointerDownObservable.add(function () {
	console.log(this.mesh_type);
}.bind(button));
```

---

<div class="post-metadata">

**Author:** ![gamedev44](https://avatars.discourse-cdn.com/v4/letter/g/a4c791/32.png) [@gamedev44](https://forum.babylonjs.com/u/gamedev44)\
**Post date:** [December 21, 2018, 10:28pm UTC](https://forum.babylonjs.com/t/pass-variable-from-button/379/9 "2018-12-21T22:28:34Z")

</div>

That’s better because I can use the button to hold the variable rather than a separate hash