Toggle Button

[StrawHatM23]

Hi all, 

I am currently trying to create a toggle button that will display "English" when I click on the English button or "French" when I click on the French button. How can I set up the English button so when it is clicked it shows the English page and when the French button is clicked it shows the French page? 

[Manoj_Kumar_ · Accepted solution]

Hello @StrawHatM23 

Here is a sample code for you to start.

<script>
function setLang(lang){
const urlParams = new URL(window.location.href);
urlParams.searchParams.set('l', lang);
window.location.href = urlParams;
}
</script> 
<%
var englishLang={text1:"Hello",text2:"World"};
var frenchLang={text1:"Bonjour",text2:"Monde"};
var selectedLang=ctx.vars.lang;
if(selectedLang == 'fr'){ 
	 var userLang=frenchLang; 
}else{ 
	var userLang=englishLang; 
}
%>
 <button onClick="setLang('en')">English</button> 
<button onClick="setLang('fr')">French</button> 
 <%= userLang.text1 %> <%= userLang.text2 %>

You will have to add a parameter in WebApp properties with the name as l and then create a variable with name lang.