WebDev v24 introduced a new switch control, which is far more attractive than a plain checkbox. I have been using a Jquery control called SwitchButton to get something similar in my interfaces for a few years now. This week, we did a lot of work on one of the sites that use that Jquery library and I figured it was a good time to replace it with a native control, which eliminated a lot of extra Jquery code and simplified the site. But I did run into one issue…

So first a quick look at what the switch control looks like

You actually have a lot of control over the look of the control, including text inside the control or outside, Text for both options shown, or just text for the selected option shown, and of course the standard array of WebDev and CSS styling options. What you are looking at is both text options shown inside the control.

So now on to the issue…

A checkbox control is treated as a boolean, and I have a habit of writing code like this:

IF ckMyControl THEN
    Do This
ELSE
    DO That
END

If the checkbox is on then it will “Do This” if it is off then it will “Do That”

The new Switch allows you to enter the value that is returned for On and Off

The issue is to support allowing custom return values, the switch control is treated like a string instead of a boolean. You might think it wouldn’t be an issue because WebDev will treat 1 and 0 the same as True and False. And it does in server code, however, in browser code, there is a difference. In JavaScript, remember at the end of the day your WebDev browser code gets converted to JavaScript code, True is a 1, but false is a -1. WebDev must be doing something behind the scenes to resolve this difference for checkboxes, but not switches since they can return other values.

To see the difference, I created a checkbox control with the following code in it

And this is the trace it produced

I create a switch with the same code

And we see that the trace, does not give the desired results, it thinks it true for both conditions

In case you wondering, I changed the return value to a -1 and it still does not work as desired, reinforcing my theory that it is treating it as a string.

This is an easy enough fix, we just have to test for = 1 instead of treating it as a boolean and we get the correct result in our trace.

Note you can also code it as = True, because at that point you are doing a comparison and both sides are treated the same, you just can’t use the shorthand boolean version

At the end of the day, the fix is very easy, once you know about it, but if you have any browser code written with shorthand boolean testing, you need to adjust it when refactoring to a Switch control, or you can end up with some unintended consequences. Ask me how I know 🙂

 

 

 

 

• WEBDEV
• WX