Console.log shows 2 values

Ask the community
,
1 
Hi,
$w.onReady(function () {
    let theSelection=0;
    $w('#festivos').onClick((event)=>{
        theSelection=$w('#festivos').selectedIndex; //choice of day
        console.log('the choice is '+ theSelection);

when I run this this is what I have:
the choice is undefined
followed
by the choice is 1 for example.
Why do I have to 2 console messages? Why do I have the undefined first??
The first time I tried the code was:

let theSelection=$w('#festivos').selectedIndex; //choice of day

and I had the same result, this is why I changed it for the let before the onClick event…
Thanks for your help

2

Well first you should give a better explanation of your project-setup.

Which one of the many elements is —>“Festivos”???

-dropdown?
-dataset
-button
-table
-whatever?

You are working with selectedIndex, may be a dropdown?

If it is a dropdown, then you sure do not want to use → onClick!
$w ( ‘#festivos’ ). onClick (( event ) =>
You surely want to use —> onChange(()=>

It is surely not a button, because a button do not have an selectionIndex.
It is also not a dataset, because a dataset has no onClick-event.

Or is it perhaps a Checkboxgroup?
But if it would be a Checkboxgroup, the event also should be an → onChange and not onClick!:wink:

3

Thanks for your answer, festivos is a radio button with 3 choices. Actually when I run it most of the time it is fine, but I don’t like this ‘most of the times’ which makes no sense to me… 2 persons checked it on their computer it was ok, but it is not all the time on mine. So I would like to understand why this one console.log prints 2 lines, the first undefined and then the correct choice. How the onClick works, why 2 values are printed and why even though theSelection is define before the onClick it prints undefined?? Thanks a lot for your time

4

I have changed the onClick to onChange and I have only one console log??? It works fine now, so please why the onClick was inducing 2 console log?

5

I tried this out myself and I don’t get 2 console log messages. But in any case, onClick() is definitely not the correct function here. As @russian-dima correctly points out, onChange is what you need.

6

Israel Thanks, this is really weird. But now it works fine. I am not sure I have understood why onChange and not onClick??

7

You want onChange(), since it’s possible to click on a Dropdown without making a change.

Using onClick(), you first click on Dropdown element to open the dropdown list. Then, you click again to select the item you want. That’s two clicks - and you only want the second one.

With onChange(), you get one event, when a new item has been selected from the dropdown list.

8

@yisrael-wix Thanks but it is not a dropdown it is a radio group

9

@beabengio
Yisrael is right, no matter if it is a dropdown or radiobox, if you try to think the logical way, what is always the first action?

-The click?
-Or the change?
Both are firing an event.

I never have tested it out, but my logic tells me, it is the onClick which starts/triggers first, followed by the change-event.

10

Thanks a lot @Velo-Ninja and @Yisrael (Wix) !!!