SO Answer / how to ignore disabled checkbox values while looping
See: http://stackoverflow.com/questions/24848776/how-to-ignore-disabled-checkbox-values-while-looping/24849014#24849014
by KooiInc MeHere
HTML
<input id="_1" type="checkbox"/>
<input id="_2" type="checkbox"/>
<input id="_3" type="checkbox"/>
<input id="_4" type="checkbox"/>
<input id="_5" type="checkbox"/>
<input id="_6" type="checkbox" disabled checked/>
<input id="_7" type="checkbox"/>
<button id="reset">Reset</button>
<p>Click one ore more checkboxes, see what happens
<br><i>Note</i>: clicking the last checkbox will disable it
</p>
CSS
body {font: 12px/15px normal verdana, arial; margin: 5em;}
.html {font-family: "courier new"; color: green}
#result p {opacity: 0;}
#result .f {opacity: 1; transition: 1.3s;}
JavaScript
(function () {
String.prototype.escHTML = function() {
return this.replace(/</g,'<');
};
var resetter = new Reset('0100030');
document.body.addEventListener('click', checkboxes);
document.querySelector('#reset').click();
function checkboxes(e)
{ var origin = e && (e.target || e.srcElement);
if (/reset/i.test(origin.id)){
resetter.reset();
return document.querySelector('#_2').click();
}
if (!origin || !origin.type || !/checkbox/i.test(origin.type)) {
return true;
}
log('clear');
if (/_7/.test(origin.id)) {
origin.disabled = true;
}
// two ways to retrieve all checked checkboxes, except disabled ones
// the long way (no selectors) => chkd
// the shortest way (css selectors) => cssQS
var chkd = [].slice.call(document.getElementsByTagName('input'))
.filter(function(cb) {
return !cb.disabled && cb.checked;
})
,cssQS = document.querySelectorAll('input:checked:not(:disabled)');
log('<b>chkd</b>.length = ', chkd.length, '<br>', enumerate(chkd));
log('<b>cssQS</b> length: ', cssQS.length, '<br>', enumerate(cssQS));
}
function Reset(state){
this.state = (state || '0100030').split('').map(mapstates);
this.reset = function () {
var cbs = [].slice.call(document.querySelectorAll('input[type=checkbox]')), i=0;
while (cbs.length) {
var cb = cbs.shift();
cb.checked = this.state[i].checked;
cb.disabled = this.state[i].disabled || false;
i += 1;
}
};
this.reconfig = function (newstate) {
this.state = (newstate || '0000000').split('').map(mapstates);
};
function mapstates(e){
e = +e;
return e <...