TOPIC:

How to Show/hide a single textbox w/ radiobutton? 10 years 3 months ago #34374

  • Topic Author
  • Franky131
  • Offline
  • Fresh Breezer
  • Fresh Breezer
  • Posts: 2
  • Thanks: 0
Hi, Im new to this thread and my first time to use this component and it looks good. :)but I have some problem with some features.

I have started working the form in classic mode and I want to have a text box that only appear if one of the radio button option is selected like

* yes
*No

if I click "No" another box should appear like

*yes //if click, box disappear
*No [box appear here] //if click, box appears


how can I make this possible? I try to use this code I found in other thread but I don't understand where to place this. and what elements are to be changed.

function ff_enf_dir_rb_action(element, action)
{

if (ff_getDivByName('lw_agent_name').style.display == 'none') //What is lw_agent_name?
{
ff_getDivByName('lw_agent_name').style.display = 'block' ;
ff_getDivByName('lw_box_agent_name').style.display = 'block'; } //what is lw_box_agent_name?
else {
ff_getDivByName('lw_agent_name').style.display = 'none' ;
ff_getDivByName('lw_box_agent_name').style.display = 'none';}

} // ff_enf_dir_rb_action


and is this the right script for that function?
and also, the text box must be required only if appear is selected.



Thanks for the help. :)
Attachments:

Please Log in or Create an account to join the conversation.

Last edit: Post by Franky131. Reason: added some question

How to Show/hide a single textbox w/ radiobutton? 7 years 4 months ago #110487

  • kayelwin
  • Offline
  • Junior Breezer
  • Junior Breezer
  • Posts: 40
  • Thanks: 0
Hey Franky,

have you manage to get the solution?

I'm having the same problem now.
I only need my textboxes to appear if my radiobutton is checked.
I assume that is the same as 'Visibility Rules' as Quick Mode Form.
Wondering if there is also another way for Classic Mode Form.

Thanks in advance.
Kayelwin

Please Log in or Create an account to join the conversation.

How to Show/hide a single textbox w/ radiobutton? 7 years 4 months ago #110556

  • chrisal's Avatar
  • chrisal
  • Offline
  • Ultimate Breezer
  • Ultimate Breezer
  • Posts: 6983
  • Karma: 187
  • Thanks: 630
Hello Kayelwin,

to activate a textfield if a Radiobutton is checked follow these steps:

1: Create a textfield
Label: up to you
Name: elem1

In the Script options:
Init Script => custom => Form Entry
Copy the following code into the textarea:
function ff_elem1_init(element, condition)
{
    switch (condition) {
        case 'formentry':
ff_getElementByName('elem1').style.display = 'none';
            break;
        default:;
    } // switch
} // ff_elem1_init

- save

2: Create a Radiobutton
Label: up to you
Name: rbshow
Value: show

In the Script options:
Action Script => custom => change
Copy the following code into the textarea:
function ff_rbshow_action(element, action)
{
    switch (action) {
        case 'change':
if(element.value == 'show'){
ff_getElementByName('elem1').style.display = 'block';
}
            break;
        default:;
    } // switch
} // ff_st_action

- save

Now test it and let me know if it works.

Here is a small sample form where you can see it:

File Attachment:

File Name: ShowHideTe...ldCM.zip
File Size:1 KB


regards
Chris
Attachments:

Please Log in or Create an account to join the conversation.

Last edit: Post by chrisal.

How to Show/hide a single textbox w/ radiobutton? 7 years 4 months ago #110727

  • kayelwin
  • Offline
  • Junior Breezer
  • Junior Breezer
  • Posts: 40
  • Thanks: 0
Hi Chrisal,

Thank you very much. I got it to work following your instructions.

However, there are few criteria I have to meet as well :
1. I need the text field to be a mandatory field , after the radiobutton is checked.

2. using your solution provided, after checking the radio button and the text field show. But is there a way to hide it again when the radio button is uncheck?

Here is the front-end of my form : cisnetwork.com/forms/index.php/archidexexhbriefrsvp
in the last question, where the radiobutton is Postage Address and the show/hide text field is Line 1.
I will apply the same codes for the rest of the text filed after Line 1. Hopefully there is no clash in that.

Thanks again Chrisal.

Rgds,
Kayelwin

Please Log in or Create an account to join the conversation.

How to Show/hide a single textbox w/ radiobutton? 7 years 4 months ago #110887

  • lennerd
  • Offline
  • Developer
  • Developer
  • Posts: 4669
  • Karma: 72
  • Thanks: 411
Hello Kayelwin,

maybe you should consider to use the Breezingforms build in functions

bfToggleFields('on', 'element', 'text', bfDeactivateField);

instead. This will also deactivate/activate required validations.

I attached a sample form for you which shows how it works.

Hope this helps.


File Attachment:

File Name: checkgroup...leV2.zip
File Size:7 KB
Regards,
Stefan

===============================================
Satisfied? Consider a membership!
===============================================
Like us on Facebook
===============================================
Follow us on Twitter
===============================================
Attachments:

Please Log in or Create an account to join the conversation.

How to Show/hide a single textbox w/ radiobutton? 7 years 4 months ago #110955

  • kayelwin
  • Offline
  • Junior Breezer
  • Junior Breezer
  • Posts: 40
  • Thanks: 0
Hi Lennerd,

I'm sorry. But can you please elaborate in detail as I'm dont really understand the flow here.

Where can I find the bfToggleFields?
And I install your sample form, but could not find it. It is a form right? package?

Sorry for being troublesome.
Appreciate your help.

Regards,
Kayelwin

Please Log in or Create an account to join the conversation.

  • Page:
  • 1
  • 2
Moderators: ForumSupport
Time to create page: 0.047 seconds

BreezingForms Pro 1.4.7 for WordPress Released!

Available in the membership section.

September Discount!

Massive discounts on all subscriptions!

Get Your Subscription Here

Quick Links

Downloads

BreezingForms

ContentBuilder

BreezingCommerce

Templates

Documentation

BreezingForms

ContentBuilder

BreezingCommerce

Apprendre BreezingForms (French Community)

Apprendre et maîtriser BreezingForms par des tutoriels et exemples, le tout en français

breezingforms.eddy-vh.com

Questions et réponses sur les forums de l'AFUJ

AFUJ

Special Offer

Summer Sale! All subscriptions at a special price!

Includes prio support, all of our current and future Joomla!® extensions and Joomla!® templates for the duration of your membership.

Get it from here

3rd Party Discount - 25% Off

We help you to keep your costs under control. If you are a new member and purchased a form building tool from a different form vendor, then you'll get a 25% discount on our subscription plans.

How to receive the discount:

Send us a quick email to sales@crosstec.org with a proof of purchase (for example a paypal receipt), await payment instructions and enjoy your membership!