Checkbox still gets unchecked despite using preventDefault

Question

When getInfo() returns false, the window alert is thrown however the checkbox still gets changed; checked if unchecked and vice versa.

Any help?

$("input[type='checkbox']").click(function(event) {
  var someCondition = getInfo();
  if (someCondition === false) {
    event.preventDefault();
    window.alert("Nope");
    return false;
  }
});

function getInfo() {
  return false; // just for testing
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="checkbox" />

I can't reproduce it: your code is working as expected. Also, avoid using alert() since it blocks script execution. Use console.log() and check your devtools console. Try console logging someCondition: are you sure it is evaluating to false? — Terry
– Terry, Commented Jan 31, 2019 at 10:01
I have placed your code in a snippet where it works absolutely fine. Check to ensure there's no errors in the console and that you're running your jQuery code after the DOM has loaded. Also ensure that getInfo() is returning false, not 'false' or 0. — Rory McCrossan
– Rory McCrossan, Commented Jan 31, 2019 at 10:03
This issue cannot be reproduced. Maybe you need to clear your cookies and cache and then try again. — Code_Ninja
– Code_Ninja, Commented Jan 31, 2019 at 10:09

lupz · Accepted Answer · 2019-01-31 10:28:06Z

0

If i understand what you need correctly you could just use this

  $("input[type='checkbox']").click(function (event) {
         var someCondition = getInfo();
         if(someCondition === false) {
            var checkVal = $("input[type='checkbox']").val();
             $("input[type='checkbox']").attr( "checked", !checkVal );
             window.alert("Nope");

         }
     });

Or if you want checkbox to be un-checked if your condition is false

  $("input[type='checkbox']").click(function (event) {
         var someCondition = getInfo();
         if(someCondition === false) {
             $("input[type='checkbox']").attr( "checked", false);
             window.alert("Nope");

         }
     });

Hope it helps

edited Jan 31, 2019 at 10:28

lupz

3,6482 gold badges30 silver badges44 bronze badges

answered Jan 31, 2019 at 10:08

Филип Матовић

261 bronze badge

Sign up to request clarification or add additional context in comments.

1 Comment

Rory McCrossan Over a year ago

Why would the OP need to make this more complicated than his existing working code?

Tahjid Ashfaque · Accepted Answer · 2019-01-31 10:22:35Z

0

Your code seems to work on fiddle, but some other plugin might be interfering with the behavior. Still, try the following and see if this solves the issue

 $("input[type='checkbox']").on('click',function (event) {
        var someCondition = getInfo();
        var checkBox = $(this);
        if(someCondition === false) { 
            event.preventDefault();
            checkBox.prop('checked', !checkBox.prop('checked'))
            window.alert("Nope");
            return false;
        }
    });

answered Jan 31, 2019 at 10:22

Tahjid Ashfaque

8552 gold badges9 silver badges19 bronze badges

1 Comment

Rory McCrossan Over a year ago

Why would the OP need to make this more complicated than his existing working code?

Collectives™ on Stack Overflow

Checkbox still gets unchecked despite using preventDefault

2 Answers 2

1 Comment

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related