Help editing a radio button plugin
I'm using this nice, simple plugin:
http://www.jqueryscript.net/form/Easy-Custom-Checkbox-And-Radio-Input-Plugin-With-jQuery-ezMark.html
- it works great, but sometimes a radio button or checkbox will be greyed out if you select certain other buttons or boxes due to a conflict management system.
Right now, when a button or box gets greyed out it has the same image as an unselected button or box. Is there a way to make it so a greyed out button or box has its own image? And also, sometimes a button or box will be automatically selected and then greyed out, so is it possible to have an image for that as well?
So, in summary, I would like it so a greyed out and unselected radio button or checkbox has its own image and a selected and greyed out radio button or checkout has its own image.
Thanks.
Here is the js code:
- (function($) {
- $.fn.ezMark = function(options) {
- options = options || {};
- var defaultOpt = {
- checkboxCls: options.checkboxCls || 'ez-checkbox',
- radioCls: options.radioCls || 'ez-radio',
- checkedCls: options.checkedCls || 'ez-checked',
- selectedCls: options.selectedCls || 'ez-selected',
- hideCls: 'ez-hide'
- };
- return this.each(function() {
- var $this = $(this);
- var wrapTag = $this.attr('type') == 'checkbox' ?
- '<div class="' + defaultOpt.checkboxCls + '">' :
- '<div class="' + defaultOpt.radioCls + '">';
- if ($this.attr('type') == 'checkbox') {
- $this.addClass(defaultOpt.hideCls).wrap(wrapTag)
- .change(function() {
- if ($(this).is(':checked')) {
- $(this).parent().addClass(
- defaultOpt.checkedCls);
- } else {
- $(this).parent().removeClass(
- defaultOpt.checkedCls);
- }
- });
- if ($this.is(':checked')) {
- $this.parent().addClass(defaultOpt.checkedCls);
- }
- } else if ($this.attr('type') == 'radio') {
- $this.addClass(defaultOpt.hideCls).wrap(wrapTag)
- .change(function() {
- $('input[name="' + $(this).attr(
- 'name') + '"]').each(
- function() {
- if ($(this).is(
- ':checked')) {
- $(this).parent().addClass(
- defaultOpt.selectedCls
- );
- } else {
- $(this).parent().removeClass(
- defaultOpt.selectedCls
- );
- }
- });
- });
- if ($this.is(':checked')) {
- $this.parent().addClass(defaultOpt.selectedCls);
- }
- }
- });
- }
- })(jQuery);