Switch-Save-Function
Index
CODE
DATABASE
Brainstorming (used elements)
How to realize this project?
​
Ok, well at first we have to do some brainstorming, to know which elements will be needed and how will look the function for this little project.
​
Which elements we will need for this?
- Data-Collection (Database) (it will be needed for safing the "switch-status" of any switch-button, we will create later in our project). Of course there is also still another way to do it without dataset, but in this case we will use a dataset.
- Dataset will be used as a connecting element between our database (data-collection) and our function (code).
​
- Of course we will need minimum 1x-switch-button. Here we can decide, how we want to design and realize our project. There are a few possible types of how to design it. We will see 2-different designs, how to solve this problem. (In this case just 1-switchbutton will be used for several "Member-State"-queries. In the second example which will follow later, we will se another solution-structure.
​
- Two more buttons are implemented in this first solution-example and connected to the dataset to allow switching the members from MEMBER-1 to MEMBER-5.
​
Abridged version:
What to do? ----> creating a save-function, which will save all states of several user in a database in "boolean"-values.
​
GO-TO ---> STEP-I.
Step-I (designing the project-flow)
Now we know what elements we need, so lets start to create and design the structure/flow of our project.
​
First of all, we create a database and configure it to our needs. We give it for examle the name "Switch-Safe-Function" and create a
new column, called "BTN-Status" (the generated ID = "btnStatus") and set the value-format to ---> "Boolean" (true/false).
​
Further we will need a switchbutton
​
​
with whose help we can switch between 2-value, to set our chosen
value (OFF or ON) ---> (FALSE or TRUE).
​
Furthermore, we will need a SAVE-button, which will save the state
of the chosen Member (Member1-Member5).
​
​
And finally we have to put in 2 normal buttons to create a switch-
function.
​
​
​
​
So that's it. These are all elements we need to realise this project.
(+ few additional text-elements.)
​
​
Our project-sketch is ready, now let's go over to the next step and give our little example a little bit of life, by coding some JavaScript-Code.
GO-TO ---> STEP-II.
Step-II (coding-part)
After we have created our little page-sketch, now we are easily able to programm all the needed interactions, because we
know exactly all the project-details.
​
As every code of page starts with "onReady", we put in our "onReady"-function
which is direcly followed by the "dataset-onReady"-function
$w.onReady(function () {
$w("#"+DATASET).onReady( () => {
​
})
})
