# Why this "wait until button click" not working?

**URL:** <https://talk.observablehq.com/t/why-this-wait-until-button-click-not-working/3680>\
**Category:** Help\
**Created:** [August 6, 2020, 10:09am UTC](https://talk.observablehq.com/t/why-this-wait-until-button-click-not-working/3680 "2020-08-06T10:09:48Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![heroboy](https://avatars.discourse-cdn.com/v4/letter/h/6f9a4e/32.png) [@heroboy](https://talk.observablehq.com/u/heroboy)\
**Post date:** [August 6, 2020, 10:09am UTC](https://talk.observablehq.com/t/why-this-wait-until-button-click-not-working/3680/1 "2020-08-06T10:09:48Z")

</div>

> **[Button test](https://observablehq.com/@heroboy/button-tes)**
>
> An Observable notebook by heroboy.

  
Please see the `btn2`

```
{
  for(let value of Generators.input(btn2))
  {
    await value;
    console.log(Date.now())
  }
}

```

Why everytime run the cell calls the `console.log`?  
Why run the cell multiple times, when the button clicked, the `console.log` will be called multiple times?

I indent `btn2` not be a viewof.

---

<div class="post-metadata">

**Author:** ![heroboy](https://avatars.discourse-cdn.com/v4/letter/h/6f9a4e/32.png) [@heroboy](https://talk.observablehq.com/u/heroboy)\
**Post date:** [August 7, 2020, 1:14am UTC](https://talk.observablehq.com/t/why-this-wait-until-button-click-not-working/3680/2 "2020-08-07T01:14:54Z")

</div>

I have fixed the code like this:

```
{
  let gen = Generators.input(btn2)
  await gen.next().value; //await is not neccessary. Just call next() is enough.
  try
  {
    for(let value of gen)
    {
      yield value;
      console.log(Date.now());
    }
  }
  finally
  {
    gen.return();
  }
}

```

I know that if I use I infinite async function, there’s no way to dispose the generator.  
But I really don’t know why I must ignore the first generator value.

---

<div class="post-metadata">

**Author:** ![heroboy](https://avatars.discourse-cdn.com/v4/letter/h/6f9a4e/32.png) [@heroboy](https://talk.observablehq.com/u/heroboy)\
**Post date:** [August 7, 2020, 1:49am UTC](https://talk.observablehq.com/t/why-this-wait-until-button-click-not-working/3680/3 "2020-08-07T01:49:16Z")

</div>

okok, I know why.  
Because `btn2.value` is not undefined. Then `Generators.input` will generator the value.  
This will help viewof operator has the first initial value.

---

<div class="post-metadata">

**Author:** ![heroboy](https://avatars.discourse-cdn.com/v4/letter/h/6f9a4e/32.png) [@heroboy](https://talk.observablehq.com/u/heroboy)\
**Post date:** [August 7, 2020, 2:11am UTC](https://talk.observablehq.com/t/why-this-wait-until-button-click-not-working/3680/4 "2020-08-07T02:11:13Z")

</div>

Now I understand this example [https://observablehq.com/@mbostock/wait-until-button](https://observablehq.com/@mbostock/wait-until-button) .  
It is not pause the evaluation at the `button` statement. But reference a not evaluated `button` value, that makes that whole cell pause evaluation. Once button value is evaluated, this cell will run immediate whenever how many times the cell runs, it will never wait button click again.

---

<div class="post-metadata">

**Author:** ![mootari](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/mootari/32/581_2.png) [@mootari](https://talk.observablehq.com/u/mootari)\
**Post date:** [August 7, 2020, 8:39pm UTC](https://talk.observablehq.com/t/why-this-wait-until-button-click-not-working/3680/5 "2020-08-07T20:39:54Z")

</div>

If all you need is a button, then Mike’s example is actually a tiny bit over-engineered. A shorter form, along with some explanations, can be found here:

> **[Button Up!](https://observablehq.com/@mootari/button-up)**
>
> An Observable notebook by Fabian Iwand.