dropdown select on containing div click pure javascript

Question

<div class="container">

  <select class="form_select">

    <option>the option</option>

  </select>

</div>



<style>

  .container {

    width: 300px;

    border:1px solid blue;

  }

  select {

    max-width:50px;

  }

</style>

I have a div containing a select option. The div is larger than the select box. Using a pure javascript solution, I would like the select dropdown to happen when the containing div is clicked outside the select box area. The only solutions I have found are jquery and I am seeking a pure javascript solution.

I don't need exact code (but it helps) as I am not very good with javascript so please explain any answer completely.

https://jsfiddle.net/m6s5j9sj/1/

Recommended for you: Get network issues from WhatsUp Gold. Not end users.

Answer 1

If what you're asking is how to cause a drop-down select to drop down programmatically (e.g., in response to a click somewhere else that triggers your code), you can't do that.

ref how open/close options of 'select' when you click on anyone 'div'

dropdown select on containing div click pure javascript

Sign up