Conditional form fields

[sanis]

Hello Eyal,

I use Geo My Wp with Buddypress plugin. Is there a way to add in the search form conditional fields? For example if option x is chosen then one more field appears, if not then it remains hidden.

Thank you!!

[Eyal Fitoussi]

Hello Sanis,
There is not such feature out of the box. Depends on your needs, you can mosts likely create something like that using Jquery. You can probably add to the form all the fields that you will be using. Then with Jquery you can hide them all except for the first field. Then, with Jquery again, you can hide and show other fields based on what the user choses in the fields that are already visible.

I hope that makes sense.

[sanis]

Hello Eyal,

is it possible to give me an example? I add a new directory in my child theme under the name “js” and in that directory I added the file “gmw-form.js”. In the file I drop the code:

/** * File: js/showhide.js * Purpose: toggle the visibility of fields depending on the value of another field **/ $(document).ready(function () { gmw-fl-form-xprofile-fields-1(); //call this first so we start out with the correct visibility depending on the selected form values //this will call our toggleFields function every time the selection value of specific field changes $("#gmw-1-field-55").change(function () { toggleFields(); }); }); //this toggles the visibility of specific fields depending on the current selected value of other fields function toggleFields() { if ($("#gmw-1-field-55").val() = Iδιώτης) $("#gmw-1-field-16").show(); else $("##gmw-1-field-16").hide(); }

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19

/** * File: js/showhide.js * Purpose: toggle the visibility of fields depending on the value of another field **/ $(document).ready(function () {     gmw-fl-form-xprofile-fields-1(); //call this first so we start out with the correct visibility depending on the selected form values     //this will call our toggleFields function every time the selection value of specific field changes     $("#gmw-1-field-55").change(function () {         toggleFields();     });   }); //this toggles the visibility of specific fields depending on the current selected value of other fields function toggleFields() {     if ($("#gmw-1-field-55").val() = Iδιώτης)         $("#gmw-1-field-16").show();     else         $("##gmw-1-field-16").hide(); }

but nothing changed…

Thank You!!

Private Content Hidden

[Eyal Fitoussi]

Hi Sanis,
Unfortunately, I don’t have an example for this scenario. But it seems that the functions above should work or at least your are in the right direction. Except for gmw-fl-form-xprofile-fields-1(); which I don’t know what that is.

What I think happens is that the file gmw-form.js does not load at all. The file won’t load unless you enqueue it using wp_enqueue_script().

What you can do is include the script in the functions.php ( instead of in its own file ) file and execute it using wp_footer action. For example:

function my_profile_fields_custom_function() { ?> <script> /** * File: js/showhide.js * Purpose: toggle the visibility of fields depending on the value of another field **/ $(document).ready(function () { gmw-fl-form-xprofile-fields-1(); //call this first so we start out with the correct visibility depending on the selected form values //this will call our toggleFields function every time the selection value of specific field changes $("#gmw-1-field-55").change(function () { toggleFields(); }); }); //this toggles the visibility of specific fields depending on the current selected value of other fields function toggleFields() { if ($("#gmw-1-field-55").val() = Iδιώτης) $("#gmw-1-field-16").show(); else $("##gmw-1-field-16").hide(); } </script> <?php } add_action( 'wp_footer', 'my_profile_fields_custom_function' );

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27

function my_profile_fields_custom_function() { ?>     <script>     /**      * File: js/showhide.js      * Purpose: toggle the visibility of fields depending on the value of another field     **/     $(document).ready(function () {         gmw-fl-form-xprofile-fields-1(); //call this first so we start out with the correct visibility depending on the selected form values         //this will call our toggleFields function every time the selection value of specific field changes         $("#gmw-1-field-55").change(function () {             toggleFields();         });       });       //this toggles the visibility of specific fields depending on the current selected value of other fields     function toggleFields() {         if ($("#gmw-1-field-55").val() = Iδιώτης)             $("#gmw-1-field-16").show();         else             $("##gmw-1-field-16").hide();     }     </script> <?php } add_action( 'wp_footer', 'my_profile_fields_custom_function' );

[Author]

Posts