Hide/show elements based on language change (Wix Multilingual)

Ask the community
, ,
3

Hi Amanda,

Thanks for your attention and advice!
Now, I’m using standard language menu element like this:

I also tried suggestions about recoding dropdown from scratch to be able to use onChange event, that stated via link you sent.

Here is a code I did:

function switchLang ( ) {
switch ( wixWindow . multilingual . currentLanguage )
{
case “en” : {
//showing current lang in dropdown element
$w ( ‘#dropdown1’ ). selectedIndex = 0 ;
//this supposed to hide/show right HTML element
$w ( ‘#html1’ ). show ();
$w ( ‘#html2’ ). hide ();
break ;
}
case “uk” : {
$w ( ‘#dropdown1’ ). selectedIndex = 1 ;
$w ( ‘#html1’ ). hide ();
$w ( ‘#html2’ ). show ();
break ;
}
}
}

$w . onReady ( function () {
//from Example
const languages = wixWindow . multilingual . siteLanguages ;

//Here I changed to uppercase label rather than full lang name
let languageOptions = languages . map (( obj ) => {
return { label : obj . languageCode . toUpperCase (), value : obj . languageCode };
});

const  currentLanguage  =  wixWindow . multilingual . currentLanguage ; 
const  filteredLanguageOptions  =  languageOptions . filter ( obj  =>  obj . value  !==  currentLanguage );

//sets dropdown value on initial page loading and hides one of HTML elements
switchLang ();

//I'm not using  filteredLanguageOptions  here because it doesn't allow dropdown to display current lang 
$w ( '#dropdown1' ). options  =  languageOptions ; 

$w ( "#dropdown1" ). onChange (( event ) => { 
    wixWindow . multilingual . currentLanguage  =  event . target . value ; 
**//on dropdown Change, I call** **switchLang() to do its work** 
    switchLang (); 
});

});

As a result, it looks like “hide” part works well but not a “show” one. No one of HTML elements is shown after 2 back and forth lang switches.

Is anything wrong with the code above?