Skip to content

Instantly share code, notes, and snippets.

@pankajpatel
Created April 9, 2017 17:23
Show Gist options
  • Save pankajpatel/53d5d0c47df687c2383f940b7ec6b72c to your computer and use it in GitHub Desktop.
Save pankajpatel/53d5d0c47df687c2383f940b7ec6b72c to your computer and use it in GitHub Desktop.
<p id="sum">0</p>
<div id="items"></div>
<script>
let items = [5, 14, 3, 8];
let sum = {
total: 0,
items: {}
}
items.forEach((item, index) => {
sum.items[index] = {checked: false, value: item};
document.querySelector('#items').innerHTML += '<p>\
<input type="checkbox" class="item"\
data-index="'+index+'" value="'+item+'"\
/> '+item+'</p>';
});
document
.querySelector('#items')
.addEventListener('click', (event) => {
let item = event.target;
if( item.classList.contains('item') ) {
if(sum.items[item.dataset.index].checked) { //already checked
sum.total -= parseInt(item.value);
} else {
sum.total += parseInt(item.value);
}
sum.items[item.dataset.index].checked = item.checked;
}
document.querySelector('#sum').innerHTML = sum.total;
})
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment