AlpineJS submit a form without refreshing the page

I am working with Hyva theme with AlpineJs on Magento and using a <form> with the needed inputs to add a product to the shopping cart.

This is part of the form code:

    <form method="post"
          id="product_addtocart_form"
    >
        <input name="product" />
        <input name="selected_configurable_option"  />
        <input name="related_product" />
        <input name="item">
    </form>

And this is the button I am using to submit the form:

    <button type="submit" form="product_addtocart_form">
        Submit
    </button>

Everything works great. However, I want to add a modal that shows after a product is added to the shopping cart but as soon as the product is added the page refreshes.

I found plenty of similar topics but nothing did it for me. I have already tried using event.preventDefault() and onsubmit="return false". Both don’t refresh the page but a product is not added.

I also tried adding products using an HTTP post method which partly solved the issue but when it comes to adding products with configurable options, it becomes too complicated.

Would you have any suggestions or ideas for an approach I can take to stop refreshing the page after a form is submitted?