Calling a function with onclick inside a form that need to be validated (Boostrap 4/Javascript)

I have a button inside a post form, where i would like to call a function from, the issue here is that when clicking the button, the closure function used to validate the form is called because it's associated to the class of the form on default bootstrap 4 function.

How could I call myfunction() without calling the validation closure function?

my code:

<form action="page.php" method="POST" class="needs-validation" novalidate>
  <input type="text" class="form-control" id="textbox" placeholder="textbox" required>
  <button class="btn btn-secondary" onlick="myfunction();">button</button>
</form>

<script> 

myfunction() {
   // ...
}

// Bootstrap 4 default form validation function
(function() {
    'use strict';

    window.addEventListener('load', function() {
      // Fetch all the forms we want to apply custom Bootstrap validation styles to
      var forms = document.getElementsByClassName('needs-validation');

      // Loop over them and prevent submission
      var validation = Array.prototype.filter.call(forms, function(form) {
        form.addEventListener('submit', function(event) {
          if (form.checkValidity() === false) {
            event.preventDefault();
            event.stopPropagation();
          }
          form.classList.add('was-validated');
        }, false);
      });
    }, false);
  })();
</script>

Here what happen when I click on the button: https://i.stack.imgur.com/Eaw3h.png