Click here to Skip to main content
14,767,352 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
when a user click on that the dropdown options are visible to them and a user can select from the available I want to simulate the visibility of options without manual clicking on dropdown element.


HTML code
    <select name="data" id = 'cohort' class="form-control" style = "width:215px; margin-left:20px; margin-bottom:8px ; height:30px" >
    <option value = 0>All</option>
    <option value = 1>Diseases</option>
    <option value = 2>Drugs</option>
    <option value = 3>Procedures</option>
    </select>


What I have tried:

I have tried using

$("#cohort").trigger('open');


document.getElementById('cohort').click()
Posted
Updated 14-Dec-20 23:57pm

You can simulate the click, but it won't cause the drop-down list to open.
const element = document.getElementById("cohort");
const event = new MouseEvent("mousedown");
element.dispatchEvent(event);
MouseEvent() - Web APIs | MDN[^]
EventTarget.dispatchEvent() - Web APIs | MDN[^]
Creating and triggering events - Developer guides | MDN[^]

If you want better programmatic control of the list, you will need to use a custom control instead. For example, Select2[^].
   
Comments
Shivang Dubey(Shivi) 15-Dec-20 6:12am
   
thanks for the quick response but that's what i want to open a drop down just by voice command..

For example: open cohort dropdown.. like that i want to achieve on my webpage..and that's why i don't want any manual intervention.
Shivang Dubey(Shivi) 15-Dec-20 6:19am
   
How can i use a select2 for my dropdown...Please guide
Richard Deeming 15-Dec-20 6:22am
   
The Select2 documentation is pretty comprehensive and easy to follow:
Getting Started | Select2 - The jQuery replacement for select boxes[^]
Shivang Dubey(Shivi) 15-Dec-20 21:28pm
   
Have applied select2 for my select but this exception is coming when I tried to simulate it....

Uncaught TypeError: Cannot read property 'apply' of undefined
at HTMLSelectElement.<anonymous> (select2.min.js:2)
at Function.each (jquery.min.js:2)
at S.fn.init.each (jquery.min.js:2)
at S.fn.init.r.fn.select2 (select2.min.js:2)
at SpeechRecognition.recognition.onresult (multilayer:1245)
   
Comments
Shivang Dubey(Shivi) 15-Dec-20 6:15am
   
Thanks for that i have already gone through the link but this is the utmost requirement of the client..

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)




CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900