Hi Wix Coders!
I'm new at coding, but have some basic knowledge, but can't figure out how to code this so it works.. In the Java script code area i don't know how to get the single radio buttons Id so i can hide and show an element, when the single radio button is seclected.
I want it to show a print button when a radio button is selected, and expand an columnstrip.. and change the button and columnstrip if another radio button is selected... Does it make sence? :D
I try to show in the video what i want it to do... Please help
Hi mattias,
I like to create radio buttons like the one you shown in the attached screen dumps where there's an image attached/associated with each radio buttons, and each of the options quite evenly stretched apart from each other. Can you please advise how did you achieve that? Or any suggestions/hints also appreciated.
Hi there,
I'm trying to implement this code on to my site to do something similar, but I'm not having much luck. Essentially, I'd like to have a quiz that reveals a "correct" sticker when the customer has selected the right answer and an "Incorrect" sticker when they select another one. I thought this would be using the same logic as the code above, but it won't reveal the image for some reason. Could anyone help?
$w.onReady(function () { //TODO: write your page related code here... }); export function button16_change(event,$w) { console.log($w("#radioGroup4").value); if ($w("#radioGroup4").value==="Radio Button1") { $w("#group4").collapse(); $w("#group3").expand(); } if ($w("#radioGroup4").value==="Radio Button2") { $w("#group3").collapse(); $w("#group4").expand(); } if ($w("#radioGroup4").value==="Radio Button3") { $w("#group3").collapse(); $w("#group4").expand(); } }
I feel like I am missing something... Is the example in this link
https://mikhails8.wixsite.com/mysite-333
supposed to show collapsed/expanded column strips? I am not seeing how this is supposed to work, nor can I get the code to work on my own site.
Hi Martin,
You need this in the code { } but i'm not sure if that's why it wont work.. But otherwise the code looks fine
{ } this should be implanted after (checkbox4).checked)
Try i out, and let me know if it works :D
so something like this:
export function checkbox4_change(event, $w) { if ($w("#checkbox4").checked){ $w("#box5").show(); } else $w("#box5").hide(); }
Hi I am trying to do similar thing with checkbox on my site:
https://mnestepny.wixsite.com/donate/account/new-page
My checkbox4 (Set Amount) should show #box5 when checked onChange. But it is not>
export function checkbox4_change(event, $w) {
if ($w("#checkbox4").checked)
$w("#box5").show();
else
$w("#box5").hide();
}
I have no Idea why is it because of rest of my code?
Please help.
Hi John,
I think the best way to do this is to click on the checkbox, then choose "onChange"
Now in the code section it should show something like this:
export function checkbox1_change(event, $w) { }
Now you need to make an if or else and do something that look like this:
if ($w("#checkbox1").checked) $w("#box2").show(); else $w("#box2").hide();
So the finished would look like this
export function checkbox1_change(event, $w) { if ($w("#checkbox1").checked) $w("#box2").show(); else $w("#box2").hide(); }
SO I am trying to do something similar with checkbox's. I want one thing to happen when the checkbox is selected and it to revert back when deselected.
Excatly, it starts to make sence to me... so its a start :D
Changed the event from onClick to onChange
When it was on click i needed to dubble click to make et expand the column strip.. Don't know why, but when i used on Change it works perfectly.
It's fine, you just need to get used to this)
Thanks Mikhail, exactly what i was looking for! Now that i see the code it's obvious, and i have only used all week to treing figure it out :D
This is the code for it:
// For full API documentation, including code examples, visit http://wix.to/94BuAAs $w.onReady(function () { //TODO: write your page related code here... }); export function button1_click(event) { console.log($w("#RadioGroup1").value); if ($w("#RadioGroup1").value == "Radio button1") { $w("#columnStrip2").collapse(); $w("#columnStrip3").collapse(); $w("#columnStrip1").expand(); } if ($w("#RadioGroup1").value == "Radio button2") { $w("#columnStrip1").collapse(); $w("#columnStrip3").collapse(); $w("#columnStrip2").expand(); } if ($w("#RadioGroup1").value == "Radio button3") { $w("#columnStrip1").collapse(); $w("#columnStrip2").collapse(); $w("#columnStrip3").expand(); } }
Read about collapse expand here:
https://support.wix.com/en/article/tutorial-adding-custom-interactivity-to-your-site
https://www.wix.com/code/reference/$w.ColumnStrip.html#collapse
Hi!
THe most simplest way, that comes to my mind - to have 3 strips and collapse/expand them, if different radio button is chosen
Look at this:
https://mikhails8.wixsite.com/mysite-333