使用<a>作为按钮发送数据表单

I want to send data from a form to other php page. Instead of a button in the form I have a button outside to submit. How can I send the data from the form to the other page? Here is the code:

<div class="body">
                <form id="productform" class="form-style-12" action="" method="post">
                <ul name="products">
                    <!-- products added to the cart will be inserted here using JavaScript -->
                </ul>
                </form>
            </div>

            <footer>
                <a href="checkout.php" id="checkoutbtn" class="checkout btn"><em>Ga verder: €<span>0</span></em></a>
            </footer>

The < ul > get filled by products using javascript.

A neat solution is to create a inside the form and style that one.

But you could solve it as you ask:

<a href="" onclick="document.getElementById('productForm').submit()">Submit!</a>

You can use this

function submitFormData() {
  document.getElementById("yourformid").submit();
}

<button onclick="submitFormdata();">Submit</button>

</div>