https://legacy.forums.gravityhelp.com/topic/radio-buttons-not-displaying Gravity Support Forums Topic: Radio Buttons Not Displaying en-US Mon, 20 Apr 2026 08:29:12 +0000 http://bbpress.org/?v=1.0.1 q https://legacy.forums.gravityhelp.com/search.php https://legacy.forums.gravityhelp.com/topic/radio-buttons-not-displaying#post-52096 Mon, 12 Mar 2012 05:50:20 +0000 Richard Vav 52096@https://legacy.forums.gravityhelp.com/ <p>Hi Zealand, If you open the libraries.js file which you will find in your themes js folder, first of all I would save a backup of the file then if you look in the file you should find the following line</p> <p>/*! <a href="http://github.com/pixelmatrix/uniform" rel="nofollow">http://github.com/pixelmatrix/uniform</a> */</p> <p>This line is the comment that marks the start of the uniform script, it ends with an empty line before the comment that marks the start of the next un-related script like so<br /> <pre><code>/* * Easy Slider 1.7 - jQuery plugin</code></pre> <p>Because you have made a backup of the file you can now safely remove all the code that is between those two comments I have shown you above including the first comment. Once you have done that you can then check your form.</p> <p>The reason the radio buttons display correctly on the admin side form preview, is that your themes styles and scripts aren't being loaded, only the default gravity forms css and scripts are loaded in the form preview. </p> https://legacy.forums.gravityhelp.com/topic/radio-buttons-not-displaying#post-52090 Mon, 12 Mar 2012 04:02:31 +0000 Zealand 52090@https://legacy.forums.gravityhelp.com/ <p>Hi Guys I appreciate your help on this, but you are dealing with someone who has little knowledge on this stuff.</p> <p>Can you please advise on what piece of code exactly I need to comment out or replace? :)</p> <p>Also see here the buttons display correctly when I preview the form <a href="http://thingk.co.nz/yourtaxback/wp-content/uploads/2012/03/Picture-4.png" rel="nofollow">http://thingk.co.nz/yourtaxback/wp-content/uploads/2012/03/Picture-4.png</a> don't know if this helps you. </p> https://legacy.forums.gravityhelp.com/topic/radio-buttons-not-displaying#post-52069 Sun, 11 Mar 2012 21:10:21 +0000 Kevin Flahaut 52069@https://legacy.forums.gravityhelp.com/ <p>Yeah, I'm pretty sure I said it was the uniform js scripting that was causing the problem way back in this thread… Hello.. is this thing on? :) </p> https://legacy.forums.gravityhelp.com/topic/radio-buttons-not-displaying#post-52056 Sun, 11 Mar 2012 16:56:50 +0000 Richard Vav 52056@https://legacy.forums.gravityhelp.com/ <p>It's the uniform script from the libraries.js file that is injecting the opacity:0 style. If you comment out or remove the second function from that file and then try viewing the form the standard radio buttons should now be visible </p> https://legacy.forums.gravityhelp.com/topic/radio-buttons-not-displaying#post-52052 Sun, 11 Mar 2012 16:46:02 +0000 Zealand 52052@https://legacy.forums.gravityhelp.com/ <p>I also found this pice of code which has the opcity set to 0.</p> <p>&lt;input id="choice_46_0" type="radio" onclick="gf_apply_rules(1,[22]);" tabindex="29" value="Yes" name="input_46" style="opacity: 0;"&gt; </p> https://legacy.forums.gravityhelp.com/topic/radio-buttons-not-displaying#post-52051 Sun, 11 Mar 2012 16:45:31 +0000 Richard Vav 52051@https://legacy.forums.gravityhelp.com/ <p>The button.css style sheet is part of the problem, the uniform plugin that is injecting the extra code and hiding the gravity forms radio buttons is the second function in the libraries.js file </p> https://legacy.forums.gravityhelp.com/topic/radio-buttons-not-displaying#post-52049 Sun, 11 Mar 2012 16:42:31 +0000 Rob Harrell 52049@https://legacy.forums.gravityhelp.com/ <p>It's the uniform script in <a href="http://thingk.co.nz/yourtaxback/wp-content/themes/yourtaxback/js/libraries.js" rel="nofollow">http://thingk.co.nz/yourtaxback/wp-content/themes/yourtaxback/js/libraries.js</a></p> <p>It's adding in span tags around the input, as well as setting the opacity to 0 via an inline style. <a href="http://grab.by/cj6O" rel="nofollow">http://grab.by/cj6O</a></p> <p>You could just axe that piece of the js file if you wanted. </p> https://legacy.forums.gravityhelp.com/topic/radio-buttons-not-displaying#post-52045 Sun, 11 Mar 2012 16:26:16 +0000 Zealand 52045@https://legacy.forums.gravityhelp.com/ <p>Hi I disable the button.css stylesheet and the radio buttons are still affected. Are you sure this is what is causing the issue? </p> https://legacy.forums.gravityhelp.com/topic/radio-buttons-not-displaying#post-52040 Sun, 11 Mar 2012 15:04:40 +0000 Zealand 52040@https://legacy.forums.gravityhelp.com/ <p>Hi Guys, thank you for your feedback. Getting help from the theme author will be like getting blood out of a stone! But at least I know where the problem is and can enlist some outside help. </p> https://legacy.forums.gravityhelp.com/topic/radio-buttons-not-displaying#post-52030 Sun, 11 Mar 2012 13:41:34 +0000 Richard Vav 52030@https://legacy.forums.gravityhelp.com/ <p>As Rob has pointed out your problem is being caused by a script trying to replace your radio buttons, after examining a couple of your themes js files I have narrowed it down to the uniform plugin contained in your themes libraries.js file and the corresponding styles contained in button.css </p> <p>The uniform plugin masks standard form inputs with custom themed inputs by injecting and modifying the html code as the page loads which is why you have extra span tags surrounding the radio inputs and why they have been hidden. </p> <p>From what I can tell though it looks like the job isn't being done properly for the radio buttons, yet it is for the check boxes. It looks like there may be a couple of styles missing from button.css because the following styles are all adjusting the background image that is supposed to form your radio button but I can't find a rule that is setting the background image. You need to speak to whoever created your theme and find out why that is missing.<br /> <pre><code>div.radio span { height: 18px; width: 18px; background-position: 0 -279px; } div.radio:active span, div.radio.active span { background-position: -18px -279px; } div.radio.focus span, div.radio:hover span { background-position: -36px -279px; } div.radio.focus:active span, div.radio:active:hover span, div.radio.active:hover span, div.radio.active.focus span { background-position: -54px -279px; } div.radio span.checked { background-position: -72px -279px; } div.radio:active span.checked, div.radio.active span.checked { background-position: -90px -279px; } div.radio.focus span.checked, div.radio:hover span.checked { background-position: -108px -279px; } div.radio.focus:active span.checked, div.radio:hover:active span.checked, div.radio.focus.active span.checked, div.radio.active:hover span.checked { background-position: -126px -279px; } div.radio.disabled span, div.radio.disabled:active span, div.radio.disabled.active span { background-position: -144px -279px; } div.radio.disabled span.checked, div.radio.disabled:active span.checked, div.radio.disabled.active span.checked { background-position: -162px -279px; }</code></pre>