How to make a dropdown menu open from a search box only when I click “enter” on keyboard?

Hey guys & gals! I want to be able to open a dropdown menu from a search box only when I tap “enter” on a desktop or mobile keyboard, how can I do it?

Here’s my code:

<!-- Search box -->

<div id=“header-pg” class=“header-pg1”>

<div class=“container-pg”>

<ul id=“header-nav-pg”>

<a><img src=“img/logo-02.jpg” class=“logo”></a>

<a><i class=“fas fa-angle-down”></i></a>

<div class=“container”>

<form class=“input-group”>

<input type=“search” onkeypress=“openDropCustom()” id=“search-btn” class=“form-control” placeholder=“:mag: search…”>

</form>

</div>

</div>

</ul>

</div>

<!-- Dropdown Menu -->

<div class=“bg-modal”>

<div class=“modal-content”>

<a class=“btn-close-popup”>&times;</a>

<h5 class=“title-modal”>Select something</h5>

<div class=“icon-check”>

<ul>

<!-- Dropdown Menu content (checkbox) -->

<li>

<label>

<div class=“check-item”>

<input type=“checkbox” name="">

<div class=“icon-box”>

🤼‍

</div>

<div class=“check-body”>

<div class=“check-title”>

Groupe

</div>

</div>

</div>

</label>

</li>

</ul>

</div>

<!-- Script Dropdown Menu -->

<script type=“text/javascript”>

function openDropCustom(){

document.querySelector(’.bg-modal’).style.display = ‘flex’;

}

document.querySelector(’.btn-close-popup’).addEventListener(‘click’,

function() {

document.querySelector(’.bg-modal’).style.display = ‘none’;

});

</script>

Thanks a lot!

PROBLEM SOVED!!!

Thanks!