Jump to content

How to prevent radio button wrapping by span and div


Go to solution Solved by CartExpert.net,

Recommended Posts

Hi.

 

Have a look at '[THEME_NAME]/js/autoload/15-jquery.uniform-modified.js' lines 1072 to 1081.

You could also try to remove the file, but you would have to remove all the lines that refer to it.

 

 

Regards.

Robin.

The CartExpert Team

  • Like 1

Share this post


Link to post
Share on other sites
  • 6 months later...

I´ve got the same problem. Using the 1.6.0.14 the radio buttons appear for half a second and then vanish to a very tiny almost impossible to see.

I don´t dare to delete the complete 15-jquery.uniform-modified.js file

Is it possible to only modify some lines and which ones?

 

Check it in my shop:

http://shop.aldeaglobaltarifa.com/es/inicio/62-havaianas-origine-ii.html

Share this post


Link to post
Share on other sites

Can any body help?

 

This is the problem that I have. When the page loads, for a second, radio buttons are as they should be, and then disappear as seen in the image, to be almost invisible not easy to see if it needs to be selected.
 
I'm using Presto-Changeo Attribute Grid. The error occurs with this module "on" or "off", so it's not the module.
 
In the following Product, it happens that, if I delete the file 15-jquery.uniform-modified.js in the themes/default-bootstrap/js/autoload, radio buttons look as they should, but in duplicate if Attribute Grid is active, and when a combination is selected, it does not deselect the previously selected.
 
I think we should correct a line in that file, 15-jquery.uniform-modified.js but I do not know which line.

 

post-171820-0-32570200-1436716756_thumb.png

post-171820-0-33595200-1436716777_thumb.png

post-171820-0-10563000-1436716799_thumb.png

post-171820-0-54717500-1436716890_thumb.png

Edited by Aldeag (see edit history)

Share this post


Link to post
Share on other sites
  • 1 month later...

If you don't wanna remove 15 - jquery.uniform - modified.js , just disable for the specific elements :
 

$(window).load(function() {
  $.uniform.restore(".noUniform");
});
<ul>
	<li>
		<label>
			<input class="noUniform" type="radio" name="my-radio"/>
		 </label>
		 .
		 .
		 .
	</li>
</ul>
  • Thanks 1

Share this post


Link to post
Share on other sites
  • 1 year later...
  • 3 months later...

 

If you don't wanna remove 15 - jquery.uniform - modified.js , just disable for the specific elements :

 

$(window).load(function() {
  $.uniform.restore(".noUniform");
});
<ul>
	<li>
		<label>
			<input class="noUniform" type="radio" name="my-radio"/>
		 </label>
		 .
		 .
		 .
	</li>
</ul>

Where do I have to modify this? Do I have to add or delete somewhere? Where and how?

I´m facing again a very old problem

 

Thanks.

Share this post


Link to post
Share on other sites
  • 2 weeks later...

Where do I have to modify this? Do I have to add or delete somewhere? Where and how?

I´m facing again a very old problem

 

Thanks.

 

 

If you don't wanna remove 15 - jquery.uniform - modified.js , just disable for the specific elements :

 

$(window).load(function() {
  $.uniform.restore(".noUniform");
});
<ul>
	<li>
		<label>
			<input class="noUniform" type="radio" name="my-radio"/>
		 </label>
		 .
		 .
		 .
	</li>
</ul>

If I do this I get problems registering customers

Share this post


Link to post
Share on other sites
  • 3 weeks later...

Hi,

 

This may be a little late to reply on this post, but it might be helpful for other people visiting here.

Sorry if my grammar isn't understandable, but I'm doing my best. :)

 

Have a look at '[THEME_NAME]/js/autoload/15-jquery.uniform-modified.js' lines 1072 to 1081.

You could also try to remove the file, but you would have to remove all the lines that refer to it.

Deleting '15-jquery.uniform-modified.js' file removes any css design applied for the input types, or other possible problems that might occur.

 

----------

Here's my solution:

On '15-jquery.uniform-modified.js' file, find the keyword 'radio' until you'll see this code below. You can delete or comment this one. Though, it removes any css design applied for radio buttons.

{
	// Radio buttons
	match: function ($el) {
		return $el.is(":radio");
	},
	apply: function ($el, options) {
		var ds, $div, $span;
		ds = divSpan($el, options, {
			divClass: options.radioClass
		});
		$div = ds.div;
		$span = ds.span;

		// Add classes for focus, handle active, checked
		bindUi($el, $div, options);
		bindMany($el, options, {
			"click touchend": function () {
				// Find all radios with the same name, then update
				// them with $.uniform.update() so the right
				// per-element options are used
				$.uniform.update($(':radio[name="' + attrOrProp($el, "name") + '"]'));
			}
		});
		classUpdateChecked($span, $el, options);
		return {
			remove: unwrapUnwrapUnbindFunction($el, options),
			update: function () {
				classClearStandard($div, options);
				classUpdateChecked($span, $el, options);
				classUpdateDisabled($div, $el, options);
			}
		};
	}
},

Refresh the page and done!

Share this post


Link to post
Share on other sites

Hi,

 

This may be a little late to reply on this post, but it might be helpful for other people visiting here.

Sorry if my grammar isn't understandable, but I'm doing my best. :)

 

Deleting '15-jquery.uniform-modified.js' file removes any css design applied for the input types, or other possible problems that might occur.

 

----------

 

Here's my solution:

On '15-jquery.uniform-modified.js' file, find the keyword 'radio' until you'll see this code below. You can delete or comment this one. Though, it removes any css design applied for radio buttons.

{
	// Radio buttons
	match: function ($el) {
		return $el.is(":radio");
	},
	apply: function ($el, options) {
		var ds, $div, $span;
		ds = divSpan($el, options, {
			divClass: options.radioClass
		});
		$div = ds.div;
		$span = ds.span;

		// Add classes for focus, handle active, checked
		bindUi($el, $div, options);
		bindMany($el, options, {
			"click touchend": function () {
				// Find all radios with the same name, then update
				// them with $.uniform.update() so the right
				// per-element options are used
				$.uniform.update($(':radio[name="' + attrOrProp($el, "name") + '"]'));
			}
		});
		classUpdateChecked($span, $el, options);
		return {
			remove: unwrapUnwrapUnbindFunction($el, options),
			update: function () {
				classClearStandard($div, options);
				classUpdateChecked($span, $el, options);
				classUpdateDisabled($div, $el, options);
			}
		};
	}
},

Refresh the page and done!

 

I deleted this lines of code and it works as I want giving better appearance to radio buttons, but then it happens I got problems with customers registration which I solved changing from One step Checkout to 5 steps.

Edited by Aldeag (see edit history)

Share this post


Link to post
Share on other sites

If I delete the code you mention, it gives the appearance I was looking for the radio buttons, but then the customer cannot register. I get an error message:

 

TECHNICAL ERROR: unable to send login informations

Details:
Error thrown: [object Object]
Text status: parsererror

 

AND:

 

Error occured: TypeError: jsonData is null
http://aldeaglobaltarifa.com/themes/default-bootstrap/cache/v_93_2ba1965672a2a61063cf04e5e32ebb5e.js
 on Line: 796

Share this post


Link to post
Share on other sites

If I delete the code you mention, it gives the appearance I was looking for the radio buttons, but then the customer cannot register. I get an error message:

 

TECHNICAL ERROR: unable to send login informations

 

Details:

Error thrown: [object Object]

Text status: parsererror

 

AND:

 

Error occured: TypeError: jsonData is null

http://aldeaglobaltarifa.com/themes/default-bootstrap/cache/v_93_2ba1965672a2a61063cf04e5e32ebb5e.js

 on Line: 796

Well, I solved this this way:

In Preferences-> Orders:

Instead One page checkout I changed to 5 steps and that solved this issue.  Thanks.

Share this post


Link to post
Share on other sites
  • 6 months later...

To solve this problem first:

  • relax
  •  try to be happy becasue you are almost solve it
  • apply the solution of Delorien, is working
Quote

$(window).load(function() {
  $.uniform.restore(".noUniform");
});

<ul>
	<li>
		<label>
			<input class="noUniform" type="radio" name="my-radio"/>
		 </label>
		 .
		 .
		 .
	</li>
</ul>

 

Edited by petrutz91 (see edit history)

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...

Important Information

Cookies ensure the smooth running of our services. Using these, you accept the use of cookies. Learn More