AWG Blogs

Friday, June 21, 2013

Disabling Siblings of Selected Radio Button

I couldn't find a "contains" selector that applied to html elements, hence the following hack less elegent (more verbose than it should be) method that functionally and stylistically disables all li containers that don't contain the radio button that's selected:
var enableOnlySelectedListItem = function(parentId, radioItemName) {
     $('#' + parentId + ' input:radio[name=' + radioItemName + ']')
         .on('click', null,"",function (event) {
            $(this).closest('ul')
                .find('input[name=' + radioItemName + ']')
                .not(this)
                .parent()
                .find(':input')
                .not('input[name=' + radioItemName + ']')
                .prop('disabled', true)
            .end()
            .end()
            .addClass('disabledtext');    
                
            $(this).closest('li')
                .find(':input')
                .prop('disabled', false)
            .end()
            .removeClass('disabledtext');    
                
             event.stopPropagation();
     });
};