I have a form where I have a dropdown box (#dropdown1) and a text input (#input1) that collects integer numbers. I have no experience with Javascript, so I’m looking for some pointers on where to begin.
Basically, it’s as simple as this: the user selects one of the two options from the dropdown box and then enters a number in the text box. The five output boxes display 5 different numbers, and the user can choose whichever output box they want.
There needs to be an if statement corresponding to the dropdown box; I know that much. Then, depending on the number entered, a certain output number will generate for each of the 5 outputs. For example, if I type “23” into the text input and select the first dropdown option, I’ll get “1” back.
I’ve tried looking at other tutorials, but I haven’t found anything helpful.
How to create if-statements…
if(){} else{}
if(i would know JS better){i would be able to solve this issue by my own.}
First declare your values…
let myValue = $w('#dropdown').value
You will need an event-trigger for example when changing value of dropdown…
$w('#dropdown').onChange(()=>{...working code here...});
Everything will work inside onRedy-code-part…
$w.onReady(()=>{...code here inside...});
You change the value of your dropdown. The onChange-event gets triggered and starts a function…
function myFunction(){
...placing here your function...
if( ){ } else{ }
}
Put all Info together and make your try to solve the problem.
You can tag me if more help is needed.
I would suggest visiting the following sites for information on programming in Javascript:
To learn about programming with Velo, read the following articles that will help you start working with Velo:
Thanks for this! While I have no Javascript experience, I have coding experience… so let’s see if I can make this work.
@russian-dima Hey Velo! I spent some time on this, and I think I’m stuck.
Specifically, I’m stuck on the onChange part and the myFunction part. I’m not sure what needs to go in those two functions.
That said, I have this so far:
let drug = $w('#dropdown1').value
let weight = $w('#input1').value
const string1 = "Acetaminophen";
const string2 = "Ibuprofen";
$w('#dropdown1').onChange(()=>{});
function myFunction(){
if($w('#dropdown1').value == string1){$w("#text96").text = String(parseInt("#input1"))} else{2}
}
What I wanted to happen there is to have my text96 box simply return the value I put in my input1 box as long as dropdown1 value is Acetaminophen. However, it doesn’t work. Perhaps that function needs to go into the onReady?
I have a little bit of pseudocode:
let drug = $w('#dropdown1').value
let weight = $w('#input1').value
$w.onReady(function(){
if($w('#dropdown1').value == string1){if weight < 6 {return "No dosage"} else if weight >=6 and weight < 11 {return "40 mg"} else if ... } else {if weight < 12 {return "No dosage"} else if weight >=12 and weight < 16 {return "50 mg"} else if ... }
Something like that, but I know I’m missing a ton of code up there! I need an output to my Text96 box.
Any more pointers?
@mschauer
This is not complete, but should give you the right direction…
const string1 = "Acetaminophen";
const string2 = "Ibuprofen"; //--> good against Headaches & all other pains
//When your page is ready....
$w.onReady(()=>{
//When some changes on your dropdown are done...
$w('#dropdown1').onChange(()=>{console.log("Dropdown-changed!")
//the onChange-Event starts your FUNCTION....//#endregion
myFunction();
});
});
function myFunction(){console.log("My Function running...")
let drug = $w('#dropdown1').value //--> here you get the "drug"-VALUE of dropdown, when changing DROPDOWN
let weight = $w('#input1').value //--> here you get the "weight"-VALUE of your INPUT
//Here you try to make a comparisson (if-query/statement)
if($w('#dropdown1').value===string1){console.log("If-Statement passed!")
$w("#text96").text = "What ever here..."
}
else{console.log("If-Statement NOT passed!")}
}
Please take a look onto the sites, suggested by Yisrael.
Especialy W3Schools can be very usefull for you.
Good luck!
@russian-dima Thanks so much for that! I’ll mark this as solved; I feel pretty confident I can finish from here!
@russian-dima Thank you Dr.
@Ahmad
Ahmad be so kind and take a look onto my Reg-Ex-problem if you find some time.
You surely have an further idea, how to solve my problem. (sorry for cross-posting).