Home Javascript does not the true result of Checkbox
Reply: 0

Javascript does not the true result of Checkbox

user1568
1#
user1568 Published in May 25, 2018, 11:10 am

I'm working with Javascript to see if a checkbox is checked or not. So I coded this:

<html>
<head>
    <style type="text/css">
    .cb{
        display: inline-block;
        width: 12px;
        height:12px;
        background: #EEE;
        border: 1px solid #999;
        border-radius:1px;
        transition: background 0.2s linear;
        cursor: pointer;
    }
    </style>
</head>
<body>
    <script type="text/javascript">
    function submitValues(){
        alert("cb1 = "+cb1.dataset.checked+"    cb2 = "+cb2.dataset.checked);
    }
    function toggleCB(cb){
        if(cb.dataset.checked == 0){
            cb.style.background = "#89D814";
            cb.style.checked = 1;
        }else{
            cb.style.background = "#EEE";
            cb.dataset.checked = 0;
        }
    }
    </script>
    <div class="cb" id="cb1" data-checked="0" onclick="toggleCB(this)"></div> cb1</br></br>
    <div class="cb" id="cb2" data-checked="0" onclick="toggleCB(this)"></div> cb2</br></br>
    <button onclick="submitValues()">Submit</button>
</body>

So if you check the checkbox within this example, after submitting the form, the true value of checkbox must be shown in the popup alert.

But the problem with it is that whenever I try to Submit the form while both checkboxes are checked, I still see the message cb1 = 0 cb2 = 0 on screen.

Now why is that?

You need to login account before you can post.

About| Privacy statement| Terms of Service| Advertising| Contact us| Help| Sitemap|
Processed in 0.355627 second(s) , Gzip On .

© 2016 Powered by mzan.com design MATCHINFO