top of page

If statement example


About

Depending on your specific use, you may need to add code to the Site Code Tab instead of the Page Code Tab at the bottom of your editor.  You can use an If statement after an event happens. You can see different events from an elements properties panel. You can either use the Properties Panel to trigger these events or you can use code. Below you will find both ways of triggering an If Statement.


 

Good to Know #1

The Code using Properties Panel


The code snippet example below shows an if statement used to show something if a value equals to something specific when a dropdown is selected or changed.



$w.onReady(function () {
 //
});

export function dropdown1_onChange() {
 let value = $w("#dropdown1").value;
 if (value === "Purple") {
        $w("#purpleTextBox").show(); //do this thing
    } else if (value !== "Purple") {
        $w("#purpleTextBox").hide(); //or else do this other thing
    }
}
    


The following example shows an If Statement when an element is empty after a button is clicked.



 $w.onReady(function () {
 //
});

export function submitButton_onClick() {
 let value = $w("#dropdown1").value;
 if (value === undefined) {
        $w("#errorMessage").expand(); //do this thing
    } else if (value !== undefined) {
        $w("#errorMssage").collapse(); // or else do this other thing
    }
}
    


 

Good to Know #2

The Code using page onReady


The code snippet example below shows an if statement used to show something if a value equals to something specific when a dropdown is selected or changed.



$w.onReady(function () {
    $w("#dropdown1").onChange((event) => {
 let value = $w("#dropdown1").value;
 if (value === "Purple") {
            $w("#purpleTextBox").show(); //do this thing
        } else if (value !== "Purple") {
            $w("#purpleTextBox").hide(); //or else do this other thing
        }
    });
});


The following example shows an If Statement when an element is empty after a button is clicked.



$w.onReady(function () {
    $w("#submitButton").onClick((event) => {
 let value = $w("#dropdown1").value;
 if (value === undefined) {
            $w("#errorMessage").expand(); //do this thing
        } else if (value !== undefined) {
            $w("#errorMssage").collapse(); // or else do this other thing
        }
    });
});
    


 

Author

by Code Queen


Stuck on a project? Hire Code Queen, LLC!

Schedule a phone call or video call directly online. In a different time zone? No problem! Code Queen currently has clients around the world.


Online Booking: Discovery Session

Contact Form: Send project details

448 views0 comments

disclaimer

a quick note about our website content

Our free and premium content is non-exclusive, meaning you are not the only one with access to the content. You can customize our content to fit your end product. Redistribution of our content is strictly prohibited. This means you cannot make our content available to others as-is, stand-alone products or stock products in ANY LANGUAGE, regardless if you offer our content for free or not.

bottom of page