update toggleswitch in settings flyout

Question

Hi 

i have a toggleswitch in my settings flyout, whereby a user can change whether to run the app online or offline, but when i change the toggle, the setting doesnt stay. for example when the setting flyout is opened, the toggleswitch is "off", now if i turn it on, i expect it to stay "on"

the code for the toggleswitch:

<div id="offline_mode" data-win-control="WinJS.UI.ToggleSwitch" data-win-options="{}">

i have an event listener

document.getElementById("offline_mode").addEventListener("onchange", changeMode, false);

the changeMode method

 function changeMode() {

            var toggleOnline = document.getElementById("offline_mode").winControl;
            
           
            toggleOnline.checked = 1 ;
WinJS.UI.process(toggleOnline);
            WinJS.UI.processAll();
        }
    }

I am completely lost, can someone point me in the right direction please.

Thank you

Sasha

Answer 1

Hi Sasha,

Go over this sample and you will see how to interact with the Toggle:

http://code.msdn.microsoft.com/windowsapps/App-settings-sample-1f762f49/sourcecode?fileId=50851&pathId=1614911592

---

Jeff Sanders (MSFT)

@jsandersrocks - Windows Store Developer Solutions @WSDevSol
Getting Started With Windows Azure Mobile Services development? Click here
Getting Started With Windows Phone or Store app development? Click here
My Team Blog: Windows Store & Phone Developer Solutions
My Blog: Http Client Protocol Issues (and other fun stuff I support)

Answer 2

Hi Jeff

i had gone through that sample app first, but even in the sample, if i change a toggle to the on or off position, it doesn't stay that way, is there some "global variable" that needs to be declared?, and then a listener to see what value it actually is, so to display the correct "position" of the toggle.

Sasha

Answer 3

Hi Jeff 

thanks for making me re-look at the sample, i have to got it to work now :)

when the page loads i checked if my variable was true/false and updated the toggle accordingly, on the "change" event listener I set the value of my variable based on whether the toggle is on/off.

Thanks again 

Sasha