CalcBuilder Forum

Hide/Show form sections depending on select radiobutton

Usuario moon_1338 2013-11-25 09:55:47

hello,
during construction calculator I took the "Example calculators: Hide / Show form sections depending on the select combo box (I)". I would like to get the same effect when using radiobutton. Could I have a short code javascript, which acted to on radiobutton? :)

Best Regards,
Marcel Haberski

Moonsoft support 2013-11-25 10:12:15

Hi,
the lines to get this working with radiobuttons are similar, but the selector to find checked option changes a little bit. We suggest to download the second example (using slide effect). It uses a simpler sintax and the only changes you'd need to do to use radiobuttons based on that example:

- Change the field optfield from 'option list' type to 'radiobutton' at fields configuration.

- At the js tab, the code would be:

//we hide all sections
CB(".dinstyle").hide();

//when radiobutton is changed:
CB("input").change(function(){

//hide all sections
CB(".dinstyle").hide();

//get the checked option to build the name of the section to be shown.
CB(".opt-"+CB("input:checked").attr("mv_option")).show(500);

});


Please contact again if you need more help with any of the steps.


Regards

Usuario moon_1338 2013-11-25 10:56:47

thanks for the quick reply :)

script works, but still I would like to find out how to get to a particular radiobutton to trigger a specific event (as in the case of option list: "if (elemSelected == 'opt4') {...}")
the name of my field of radiobutton is "second_tab" and radiobuttonns turn: val1, val2, val3

regards :)

Edited by moon_1338 - 25.11.2013 10:57

Moonsoft support 2013-11-25 12:55:40

Hi,
the value returned is at this part:

CB("input:checked").attr("mv_option")

So, you can recover which option is selected:

var selected=CB("input:checked").attr("mv_option");

and then apply the conditions needed:

if(selected=="val1"){

.....
}


Hope this helps, regards

Usuario moon_1338 2013-11-25 16:25:14

work!, thank you! :)

...
List Manager

Build different lists for your site

Buy now!
...
CalcBuilder

Create dynamic calculators

Buy now!