[jQuery] PrettyCheckboxes not working with radio array names

[Ahhk]

With this script, I cant get it to work with radio buttons when their names
are used as arrays (ie. group[1], group[2], etc). Each radio button in each
group gets treated as a stand-alone radio button (on the UI side only) - as
if they were checkboxes.

In other words, each RB in each group can be checked/unchecked independent
of the other RBs in the same name group.

If I use non-array names for the radio button groups (ie group1, group2,
etc) it works fine. But, I need the array names because the number of groups
changes and I need to loop thru however many there are.

Every attempt I've made to get it to work with array names has broken it.
<sigh>

Any insight, code change, fix, etc would be greatly appreciated.

The script is called via:
$(’input[type=checkbox],input[type=radio]‘).prettyCheckboxes();

Thanks for any help!



<code>
/* ------------------------------------------------------------------------
prettyCheckboxes

Developped By: Stephane Caron (http://www.no-margin-for-errors.com)
Inspired By: All the non user friendly custom checkboxes solutions
Version: 1.1

Copyright: Feel free to redistribute the script/modify it, as
long as you leave my infos at the top.
------------------------------------------------------------------------- */
jQuery.fn.prettyCheckboxes = function(settings) {
settings = jQuery.extend({
checkboxWidth: 20,
checkboxHeight: 20,
className : 'prettyCheckbox',
display: 'inline'
}, settings);

$(this).each(function(){
// Find the label
$label = $('label[for='+$(this).attr('id')+']');

// Add the checkbox holder to the label
$label.prepend("");

// If the checkbox is checked, display it as checked
if($(this).is(':checked')) { $label.addClass('checked'); };

// Assign the class on the label
$label.addClass(settings.className).addClass($(this).attr('type')).addClass(settings.display);

// Assign the dimensions to the checkbox display
$label.find('span.holderWrap').width(settings.checkboxWidth).height(settings.checkboxHeight);
$label.find('span.holder').width(settings.checkboxWidth);

// Hide the checkbox
$(this).addClass('hiddenCheckbox');

// Associate the click event
$label.bind('click',function(){
$('input#' + $(this).attr('for')).triggerHandler('click');

if($('input#' + $(this).attr('for')).is(':checkbox')){
$(this).toggleClass('checked');
$('input#' + $(this).attr('for')).checked = true;
}else{
$toCheck = $('input#' + $(this).attr('for'));

// Uncheck all radio
$('input[name='+$toCheck.attr('name')+']').each(function(){
$('label[for=' + $(this).attr('id')+']').removeClass('checked');
});

$(this).addClass('checked');
$toCheck.checked = true;
};
});

$('input#' + $label.attr('for')).bind('keypress',function(e){
if(e.keyCode == 32){
if($.browser.msie){
$('label[for='+$(this).attr('id')+']').toggleClass("checked");
}else{
$(this).trigger('click');
}
return false;
};
});
});
};

checkAllPrettyCheckboxes = function(caller, container){
if($(caller).is(':checked')){
// Find the label corresponding to each checkbox and click it
$(container).find('input[type=checkbox]:not(:checked)').each(function(){
$('label[for='+$(this).attr('id')+']').trigger('click');
if($.browser.msie){
$(this).attr('checked','checked');
}else{
$(this).trigger('click');
};
});
}else{
$(container).find('input[type=checkbox]:checked').each(function(){
$('label[for='+$(this).attr('id')+']').trigger('click');
if($.browser.msie){
$(this).attr('checked','');
}else{
$(this).trigger('click');
};
});
};
};
</code>
-- 
View this message in context: 
http://www.nabble.com/PrettyCheckboxes-not-working-with-radio-array-names-tp20412719s27240p20412719.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.