crosspeaksoftware / scaffolding

Responsive Design Scaffolding for WordPress
https://scaffolding.io
86 stars 39 forks source link

Gravity Forms Conditional Fields #77

Closed gthayer closed 9 years ago

gthayer commented 10 years ago

Something with iCheck is breaking conditional fields in Gravity Forms. Commenting out "radioClass: 'iradio_square'," fixes the conditional fields, but breaks the styles.

gthayer commented 10 years ago

Upon futher inspection, it appears to only effect conditions which are toggled by radio and checkbox fields. @jlavoie13 has reachout out to iCheck's developers to see if they know of a fix.

jlavoie13 commented 10 years ago

Wrote this script to get it to work. Could probably be written better but seems to work well... but only with a field with one checkbox input.

if($.fn.iCheck) {
        $('input').iCheck({
            checkboxClass: 'icheckbox_square',
            radioClass: 'iradio_square',
            increaseArea: '20%' // optional
        });
        $('input[onclick]').each(function() {
            var onclick_atts = $(this).get(0).attributes.onclick.nodeValue;
            var nums = onclick_atts.match(/(\d+)/g);
            $(this).on('ifChecked', function(event) {
                for (i=1; i<nums.length;i++) {
                    $('#field_' + nums[0] + '_' + nums[i] +'').css('display', 'list-item');
                }
            });
            $(this).on('ifUnchecked', function(event) {
                for (i=1; i<nums.length;i++) {
                    $('#field_' + nums[0] + '_' + nums[i] +'').css('display', 'none');
                }
            });
        });
    }

Doesn't work for fields with multiple radio or checkbox inputs. The onclick attribute (onclick="gf_apply_rules(7,[19]);) is applied to all radio inputs and I don't know how to access which of the values actually triggers the logic to show the hidden field.

jlavoie13 commented 10 years ago

Someone replied to my issue thread https://github.com/fronteed/iCheck/issues/171. Haven't tested it.

gthayer commented 10 years ago

I just tested it and it appears to work. iCheck is also creating a simlar, but different issue with dropdown fields in WooCommerce. I was able to solve the specific issue I was facing with the code below, but I have not found a programatic solution yet.

$('input#ship-to-different-address-checkbox').on('ifToggled', function(event){
    $( 'div.shipping_address' ).toggle();  
});
jlavoie13 commented 9 years ago

Closing, iCheck has been removed.