# Pull down as "menu"?

**URL:** https://discuss.elastic.co/t/pull-down-as-menu/366956
**Category:** Kibana
**Tags:** vega
**Created:** [September 23, 2024, 11:33am UTC](https://discuss.elastic.co/t/pull-down-as-menu/366956 "2024-09-23T11:33:47Z")
**Posts on this page:** 3
**Page:** 1

<div class="post-metadata">

### Author: ![cjessing](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/cjessing/32/133870_2.png) [@cjessing](https://discuss.elastic.co/u/cjessing)
#### Post date: [September 23, 2024, 11:33am UTC](https://discuss.elastic.co/t/pull-down-as-menu/366956/1 "2024-09-23T11:33:47Z")

</div>

I have a series of Kibana dashboards that I would like to be able to switch between using a common "drop down menu" that I would place on each of them. I have managed to draw the actual drop down using the following code, but I'm stuck when it comes to detecting events on the drop down and subsequently changing to a diffrent dashboard:

```auto
{
  "$schema": "https://vega.github.io/schema/vega/v5.json",
  "signals": [
    {
      "value": ["Dashboard #1"],
      "bind": {
        "input": "select", 
        "options": [
          ["Dashboard #1"], 
          ["Dashboard #2"], 
          ["Dashboard #3"]
        ]
      }
    }
  ]
}

```

Please help 🙂

---

<div class="post-metadata">

### Author: ![carly.richmond](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/carly.richmond/32/104935_2.png) [@carly.richmond](https://discuss.elastic.co/u/carly.richmond)
#### Post date: [October 2, 2024, 8:27am UTC](https://discuss.elastic.co/t/pull-down-as-menu/366956/2 "2024-10-02T08:27:47Z")

</div>

Hi @cjessing.

Did you find a way to do this? I don't believe it's possible to change the browser URL, and you would need to embed the URL in a Vega component somehow. Looking at the [Vega signals documentation](https://vega.github.io/vega/docs/signals/), I'm guessing you would want to use a `mouseup` event, and could update the url value of that component (disclaimer I've not tried this out):

```auto
{
  "name": "clickUpdate",
  "on": [
          {"events": "*:mouseup", "update": "/*set URL here*/"}
  ]
}

```

Can you explain why you want to use Vega for this? I'm interested in the use case as it would probably be easier to [embed your dashboard](https://www.elastic.co/blog/how-to-embed-kibana-dashboards) using an iframe and change the iframe source using a JavaScript dropdown control.

Let us know!

---

<div class="post-metadata">

### Author: ![cjessing](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/cjessing/32/133870_2.png) [@cjessing](https://discuss.elastic.co/u/cjessing)
#### Post date: [October 3, 2024, 4:51am UTC](https://discuss.elastic.co/t/pull-down-as-menu/366956/3 "2024-10-03T04:51:09Z")

</div>

I'll have a look when I get around to it again. 🙂
