Javascript function only works on second click

Hi all!
I have a web block with a dropdown select and i'm using a javascript function to allow me to hide the dropdown's list of options, whenever i click anywhere on the page. The function is working, but when i try to use the dropdown again, it only opens on the second click.


This is my javascript function:

"<script>
{
    let hide = document.getElementById('"+ActionOptions.Id+"');
    document.onclick = function()
    {
        if(div.target.id !== '"+ActionOptions.Id+"')
        {
            hide.style.display = 'none';
        }
    };
};
</script>"

If someone could help with this, it would be amazing.

Cheers,
João Rodrigues

Hi João,

It looks like the dropdown options are not displayed but still active. This would justify why when clicking on them they don't appear (the state moves to inactive) and on the second click moves to active. Pure especulation since I don't have any code to see.

Can you make a sample page available to see the problem?

Cheers,

RG

Ruben Goncalves wrote:

Hi João,

It looks like the dropdown options are not displayed but still active. This would justify why when clicking on them they don't appear (the state moves to inactive) and on the second click moves to active. Pure especulation since I don't have any code to see.

Can you make a sample page available to see the problem?

Cheers,

RG

Hi Ruben,

Ignore the size and test values, as this is just a test web block to get this working.
This is the dropdown i have, when i click on the "Select Options" that container appears:

Hope this helps you visualize the situation.


Cheers,
João Rodrigues

Hi João,

Thank you for the drawing, but I was expecting a sample page! So that I could inspect and do understand the behavior... :D


Cheers,

RG

Ruben Goncalves wrote:

Hi João,

Thank you for the drawing, but I was expecting a sample page! So that I could inspect and do understand the behavior... :D


Cheers,

RG


Hi Ruben,

Sorry! Here's a sample page for you to inspect! The Dropdown Select doesn't have any values but it's possible to understand it's behaviour


Thanks for the help,

João Rodrigues

Hi João,

I have problems with references, as such I cannot publish it...

Can you provide a link, for it, in your personal environment or so? (you can do it through PM).

Cheers,

RG


João Rodrigues wrote:

Ruben Goncalves wrote:

Hi João,

Thank you for the drawing, but I was expecting a sample page! So that I could inspect and do understand the behavior... :D


Cheers,

RG


Hi Ruben,

Sorry! Here's a sample page for you to inspect! The Dropdown Select doesn't have any values but it's possible to understand it's behaviour


Thanks for the help,

João Rodrigues



Try to use below jquery hope it will work

$(document).on("click","#test-id",function() {

     alert("testing");

 });