checkbox return error Uncaught RangeError: Maximum call stack size exceeded on change

Im trying to update chckbox value in Mysql DB but im stuck with this error:

Uncaught RangeError: Maximum call stack size exceeded

Html:

<input type="checkbox" data-id="<?php echo $row['id']; ?>" name="product_edit_active_control" id="product_edit_active_control" value='' />

Javascript:

$(document).ready(function() {
         $("#product_edit_active_control").on("change", function() {
              var id    = $(this).attr("data-id");
              var activ = $(this).val();
                  if ($(this).is(":checked"))
                 {
                    var activ = $(this).val(1);
                  } else {
                    var activ = $(this).val(0);
                  }
                   $.post("inc/sql/produse/activare-produs.php", {
                     id:id, 
                     product_edit_active_control:activ

               },  function(data) {

                     $.toast({
                    heading: 'Success',
                    text: 'MODIFICATION SUCCESS! ',
                    showHideTransition: 'slide',
                    icon: 'success',
                    loaderBg: '#fff',
                    hideAfter: 1300,
                    position: 'top-right'
                })

             });
         });
     });