Skip to content Skip to sidebar Skip to footer
Home / Checkbox / Css / Javascript

Issue In Hiding My Data With Checkbox

Post a Comment
I have two series of data and trying to hide them by clicking on the check box but the data series do not get hidden. You can see my data series in my fiddle. And that is the code

Solution 1:

For this, you need to set the attribute visibility - http://jsfiddle.net/TrpcW/4/

<body>
    <div class="line1">data1</div><div class="line2">data2</div>
    <input type="checkbox" class="messageCheckbox" value="line1" onclick="showOrHide(0);" unchecked />1
    <input type="checkbox" value="line2" class="messageCheckbox" onclick="showOrHide(1);" unchecked />2
</body>

showOrHide = function (i) {
    var selectt = document.getElementsByClassName("messageCheckbox")[i].value;
    if (document.getElementsByClassName("messageCheckbox")[i].checked) {
        document.getElementsByClassName(selectt)[0].style.visibility = "hidden";
    } else {
        document.getElementsByClassName(selectt)[0].style.visibility = "visible";
    }
}

Post a Comment for "Issue In Hiding My Data With Checkbox"