# How to Close dialog box after 3 sec

**URL:** <https://discourse.aurelia.io/t/how-to-close-dialog-box-after-3-sec/1510>\
**Category:** Help Requests\
**Created:** [August 7, 2018, 11:47am UTC](https://discourse.aurelia.io/t/how-to-close-dialog-box-after-3-sec/1510 "2018-08-07T11:47:45Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![lakmi](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/lakmi/32/810_2.png) [@lakmi](https://discourse.aurelia.io/u/lakmi)\
**Post date:** [August 7, 2018, 11:47am UTC](https://discourse.aurelia.io/t/how-to-close-dialog-box-after-3-sec/1510/1 "2018-08-07T11:47:45Z")

</div>

I go through the sample code in tutorial but its works for me when I created app using aurelia cli but when I create same app using webpack that not work.

This is the code i taken from tutorial

```auto
import {EditPerson} from './edit-person';
  import {DialogService} from 'aurelia-dialog';
  export class Welcome {
    static inject = [DialogService];
    constructor(dialogService) {
      this.dialogService = dialogService;
    }
    person = { firstName: 'Wade', middleName: 'Owen', lastName: 'Watts' };
    submit(){
      this.dialogService.open({viewModel: EditPerson, model: this.person}).then(openDialogResult => {
        // Note you get here when the dialog is opened, and you are able to close dialog
        setTimeout(() => {
          openDialogResult.controller.cancel('canceled outside after 3 sec')
        }, 3000);

        // Promise for the result is stored in openDialogResult.closeResult property
        return openDialogResult.closeResult;
      }).then((response) => {
        if (!response.wasCancelled) {
          console.log('good');
        } else {
          console.log('bad');
        }
        console.log(response);
      });
    }
  }

```

My problem is close dialog box after 3 sec.

---

<div class="post-metadata">

**Author:** ![chabou](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/chabou/32/139_2.png) [@chabou](https://discourse.aurelia.io/u/chabou)\
**Post date:** [August 7, 2018, 12:01pm UTC](https://discourse.aurelia.io/t/how-to-close-dialog-box-after-3-sec/1510/2 "2018-08-07T12:01:10Z")

</div>

> [@lakmi](#):
>
> ```auto
> .then((response) => {
> if (!response.wasCancelled) {
> console.log('good');
> } else { 
> console.log('bad');
> }
> console.log(response); 
> });
> 
> ```

It depends which version of Aurelia-dialog you’re using, but unless you’re using a very old one, you should use `whenClosed` instead of `then` here. Otherwise you’ll have this part of the executed right after the dialog has been created whereas you’ll most probably want to have it executed when the dialog is closed.

---

<div class="post-metadata">

**Author:** ![huochunpeng](https://avatars.discourse-cdn.com/v4/letter/h/49beb7/32.png) [@huochunpeng](https://discourse.aurelia.io/u/huochunpeng)\
**Post date:** [August 7, 2018, 12:12pm UTC](https://discourse.aurelia.io/t/how-to-close-dialog-box-after-3-sec/1510/3 "2018-08-07T12:12:49Z")

</div>

Currently aurelia-dialog has issue with webpack, you cannot use `EditPerson` dialog directly.

Do

```auto
import {PLATFORM} from 'aurelia-pal';
//...
this.dialogService.open({viewModel: PLATFORM.moduleName('./edit-person'), model: this.person})

```

---

<div class="post-metadata">

**Author:** ![lakmi](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/lakmi/32/810_2.png) [@lakmi](https://discourse.aurelia.io/u/lakmi)\
**Post date:** [August 7, 2018, 12:25pm UTC](https://discourse.aurelia.io/t/how-to-close-dialog-box-after-3-sec/1510/4 "2018-08-07T12:25:35Z")

</div>

> [@lakmi](#):
>
> setTimeout(() =\> { openDialogResult.controller.cancel(‘canceled outside after 3 sec’) }, 3000);

when I cording its gives this `openDialogResult.controller.cancel` there are no method in `openDialogResult` like ` controller.cancel` that is error I got in when I work with webpack this code work properly aurelia CLI