Submitting form with hyperlink

I have a HTML5 submit button that I want converted to a hyperlink for submitting. Is there a simple method for this?

<button type="submit" name="signin" id="signin"> Send </button>

New custom submit button that I need to submit from

<a href="#">
    <div class="button-1 valign-text-middle roboto-medium-white-16px">
        Send-TEST
    </div>
</a>

you can use the onclick attribute on the <a> tag to execute JavaScript code when the hyperlink is clicked. The JavaScript code document.getElementById('signin').click(); triggers a click event on the original submit button, which will submit the form.

Make sure to replace 'signin' with the appropriate id if your submit button has a different ID.

Here is some example

<a href="#" onclick="document.getElementById('signin').click(); return false;">
  <div class="button-1 valign-text-middle roboto-medium-white-16px">
    Send-TEST
  </div>
</a>

To convert your HTML5 submit button to a hyperlink for submitting, you can use JavaScript to trigger the form submission when the hyperlink is clicked. I don't think anything is built in like Barmar mention in a comment.

Here's an example with JS:

HTML

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-html -->

<form id="myForm" action="your-action-url" method="POST">
    <!-- Your form fields here -->
</form>

<a href="#" onclick="document.getElementById('myForm').submit(); return false;">
    <div class="button-1 valign-text-middle roboto-medium-white-16px">
        Send-TEST
    </div>
</a>

<!-- end snippet -->

In this example, we have an HTML form with the ID myForm, which contains your form fields. The action attribute specifies the URL where the form data should be submitted.

The <a> tag acts as a hyperlink, and the onclick attribute triggers the JavaScript code when the hyperlink is clicked. The JavaScript code document.getElementById('myForm').submit() accesses the form element and submits it.

By using this approach, clicking on the "Send-TEST" hyperlink will trigger the form submission, similar to clicking the original submit button. Make sure to replace 'your-action-url' in the form's action attribute with the appropriate URL to handle the form submission on your server.

Here I place the anchor element together with a submit button inside a label element. By clicking the anchor element the submit button is also triggered. This only works as long as the anchor element do not have a href attribute, and therefor it is rendered as a plain text. Consequentially the anchor needs styling as an anchor.

Notice that the basic form and the functionality of submitting it using the anchor/label do not require any JavaScript.

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->

document.forms.form01.addEventListener('submit', e => {
  e.preventDefault();
  console.log('submit...');
});

<!-- language: lang-css -->

input[type='submit'] {
  display: none;
}

input~a {
  color: blue;
  text-decoration: underline;
  cursor: pointer;
}

<!-- language: lang-html -->

<form name="form01">
  <label>
    <input type="submit">
    <a>Submit</a>
  </label>
</form>

<!-- end snippet -->

Just style it to make it look like a hyper link with CSS, if you wish for the behaviour of a submit button looking like a hyperlink.

Reset the styles for the button and style it the way you want it to look like.