# Implementing window on:Click or document.getElementById
**URL:** https://forums.bitovi.com/t/implementing-window-on-click-or-document-getelementbyid/839
**Category:** Uncategorized
**Created:** [March 30, 2018, 9:48am UTC](https://forums.bitovi.com/t/implementing-window-on-click-or-document-getelementbyid/839 "2018-03-30T09:48:57Z")
**Posts on this page:** 5
**Page:** 1
### Author:  [@Chetna\_Singh](https://forums.bitovi.com/u/Chetna_Singh)
#### Post date: [March 30, 2018, 9:48am UTC](https://forums.bitovi.com/t/implementing-window-on-click-or-document-getelementbyid/839/1 "2018-03-30T09:48:57Z")
How is it possible to implement window.on click functions in DoneJs ?
Whenever the user clicks on the window my pop up menu should close.
---
### Author:  [@chasen](https://forums.bitovi.com/u/chasen)
#### Post date: [March 30, 2018, 10:54pm UTC](https://forums.bitovi.com/t/implementing-window-on-click-or-document-getelementbyid/839/2 "2018-03-30T22:54:55Z")
Hi @Chetna_Singh,
There’s a few ways you could do this. If you _always_ need to listen to this event, you don’t need to use anything from CanJS; you can listen for [click events](https://developer.mozilla.org/en-US/docs/Web/Events/click) like this:
```auto
window.addEventListener('click', function(event) {
// event.target is the element that was clicked
});
```
What you might need instead is to only have the listener set up when a specific component is in your page; let’s say you have a `pop-up` component, then you could set up a listener like this:
```auto
import Component from "can-component";
Component.extend({
tag: "pop-up",
// ... view, ViewModel, etc.
events: {
"{window} click": function(window, event) {
// event.target is the element that was clicked
}
}
});
```
This way, the click listener is only active when your popup is shown on the screen. It will fire for _any_ click, so you might need to check if the element is outside your popup, something like:
```auto
"{window} click": function(window, event) {
// event.target is the element that was clicked
if (this.element.contains(event.target) === false) {// Clicked element is outside of the component
// Close the popup
}}
}
```
Here’s a JS Bin I made with some of this code: [https://jsbin.com/bujapotuci/1/edit?js,console,output](https://jsbin.com/bujapotuci/1/edit?js,console,output)
Hopefully this helps, please let us know if we can answer any other questions.
---
### Author:  [@justinbmeyer](https://forums.bitovi.com/u/justinbmeyer)
#### Post date: [March 31, 2018, 2:01am UTC](https://forums.bitovi.com/t/implementing-window-on-click-or-document-getelementbyid/839/3 "2018-03-31T02:01:54Z")
I think you can also use `connectedCallback` on the VM:
```auto
ViewModel: {
connectedCallback(){
this.listenTo(window, "click", function(event){})
}
}
```
---
### Author:  [@Chetna\_Singh](https://forums.bitovi.com/u/Chetna_Singh)
#### Post date: [April 2, 2018, 3:45am UTC](https://forums.bitovi.com/t/implementing-window-on-click-or-document-getelementbyid/839/4 "2018-04-02T03:45:55Z")
thanks @chasen , I will try to implement this
---
### Author:  [@Chetna\_Singh](https://forums.bitovi.com/u/Chetna_Singh)
#### Post date: [April 2, 2018, 3:46am UTC](https://forums.bitovi.com/t/implementing-window-on-click-or-document-getelementbyid/839/5 "2018-04-02T03:46:27Z")
thank you @justinbmeyer